Panning Event similar to LabelClicked event in CategoryAxis

[Joseph Cellucci]

I have an SfChart where month names are plotted along the CategoryAxis. I have a requirement to select data for one month at a time when a month name (Axis Label) is tapped which I have achieved using  LabelClicked event in CategoryAxis. Similarily I have another requirement to select a month by panning finger over the month names (Axis labels on Category axis). When the user pans his finger say he starts panning from January and lifts his finger at March, the selection event has to fire and I need to identify March is selected. How can I achieve this requirement?

[Yuvaraj Palanisamy]

Hi Joseph Cellucci, 

 

Greetings from Syncfusion. 

 

We have achieved your requirement “While panning the chart area, made datapoint selection” with the help of extending the ChartTrackballBehavior with setting of ShowLine & ShowLabel to false and select the datapoint in TrackballCreated event in SfChart. Please find the code example below. 

 

MainPage.xaml 

<chart:SfChart x:Name="sfChart"  

               HorizontalOptions="FillAndExpand" 

               VerticalOptions="FillAndExpand" 

               TrackballCreated="sfChart_TrackballCreated"> 

    <chart:SfChart.PrimaryAxis> 

        <chart:CategoryAxis/> 

    </chart:SfChart.PrimaryAxis> 

 

    <chart:SfChart.SecondaryAxis> 

        <chart:NumericalAxis Maximum="14"/> 

    </chart:SfChart.SecondaryAxis> 

 

    <chart:ColumnSeries x:Name="series"  

                      EnableDataPointSelection="True"  

                      SelectedDataPointColor="Blue" 

                      ItemsSource="{Binding Data}"  

                      XBindingPath="XValue" 

                      YBindingPath="YValue"> 

    </chart:ColumnSeries> 

 

    <chart:SfChart.ChartBehaviors> 

        <local:ChartTrackballBehaviorExt ShowLabel="False" ShowLine="False" /> 

    </chart:SfChart.ChartBehaviors> 

</chart:SfChart> 

 

MainPage.xaml.cs 

private void sfChart_TrackballCreated(object sender, ChartTrackballCreatedEventArgs e) 

{ 

    if (e.ChartPointsInfo.Count > 0) 

    { 

        int seriesIndex = 0; 

        series.SelectedDataPointIndex = e.ChartPointsInfo[seriesIndex].DataPointIndex; 

    } 

} 

 

ChartTrackballBehaviorExt.cs 

public class ChartTrackballBehaviorExt : ChartTrackballBehavior 

{ 

    protected override void OnTouchDown(float pointX, float pointY) 

    { 

        base.OnTouchDown(pointX, pointY); 

        Show(pointX, pointY);             

    } 

 

    protected override void OnTouchMove(float pointX, float pointY) 

    { 

        base.OnTouchMove(pointX, pointY); 

        Show(pointX, pointY); 

    } 

} 

 

Also, we have attached the sample for your reference. Please find the sample from the below link. 

 

Sample: https://www.syncfusion.com/downloads/support/forum/165223/ze/ChartSample_CustomTrackball-1804482979  

  

For more details, please refer the below link. 

 

KB: https://www.syncfusion.com/kb/8620/how-to-activate-the-trackball-on-touch  

UG: https://help.syncfusion.com/xamarin/charts/trackball#events  

 

Regards, 

Yuvaraj.