Multiseries chart with one axis, multiple series, different tooltips

Hi there,

I'm working with a multi series chart in Blazor, and have a use case I'm struggling to accomplish

The chart is bound against a set of complex data that looks like so 

class Data
{
   string x;
   double y1;
   double y2;
}

What I'd like to do is plot two series (a line + column) against y1, but have the tooltip for the line show Y2 instead of Y1.

So hovering over the column gives x : y1

And hovering over the line gives x : y2

But the line follows the columns rather than being plotted against its own axis.

From what I've tried the tooltip seems to be tied to the series it's on. Is there a way to customize the tooltip using the data itself?

Thanks,

Greg Slasor




1 Reply 1 reply marked as answer

DG Durga Gopalakrishnan Syncfusion Team October 12, 2020 12:43 PM UTC

Hi Greg, 

Greetings from Syncfusion. 

We have analysed your queries. We suggest you to use multiple axis by mapping Name of another y axis to series YAxisName. We have prepared sample based on your requirement. Please find the code snippet and screenshot. 

<SfChart> 
      <ChartPrimaryYAxis Minimum="0" Maximum="100" Interval="20" LabelFormat="{value}°F"> 
       //… 
    </ChartPrimaryYAxis> 
    <ChartAxes> 
      <ChartAxis Minimum="24" Maximum="36" Interval="2" OpposedPosition="true" RowIndex="0"          Name="yAxis2" LabelFormat="{value}°C">                   
       //… 
     </ChartAxis> 
   </ChartAxes> 
  <ChartSeriesCollection> 
      <ChartSeries DataSource="@ChartData" XName="x" YName="y1" Type="ChartSeriesType.Column"> 
      </ChartSeries> 
      <ChartSeries DataSource="@ChartData" YAxisName="yAxis2" XName="x" YName="y2"     Type="ChartSeriesType.Line"> 
        </ChartSeries> 
  </ChartSeriesCollection> 
</SfChart> 

 

Kindly revert us, if you have any concerns. 

Regards, 
Durga G 


Marked as answer
Loader.
Up arrow icon