Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
60
Changing background color of LineChart
posted

Hi,

 We are implementing zooming functionality on chart by selecting particular area on line chart by dragging mouse.

Now what we need to do is while dragging mouse, we want to change the background color of selected area on line chart.

How can we perform this ?

Thanks in advance

  • 739
    posted

    Hi,

    This is the way how to create a custom drawing:

    1.       Create a canvas and add the XamChart to it as a child.

    2.       Use mouse event and add a rectangle to the canvas as a first child.

    3.       Because the background of the chart is transparent, you can see your rectangle as a background drawing.

    4.       Use GetPosition methods to get pixel position from axis values. (SEE SAMPLE BELOW)

     

    Thanks,

    GoranS

    XAML:

    <Grid x:Name="LayoutRoot">
       <Canvas Name="Canvas1" Margin="0,0,0,0">
          <igCA:XamChart Name="Chart1" Width="523" Height="329"/>
       </Canvas>
    </Grid>

    C#:

    protected override void OnMouseDown(System.Windows.Input.MouseButtonEventArgs e)

    {

    double x1 = Chart1.GetPosition(Infragistics.Windows.Chart.AxisType.PrimaryX, 1);

    double x2 = Chart1.GetPosition(Infragistics.Windows.Chart.AxisType.PrimaryX, 3);

    double y1 = Chart1.GetPosition(Infragistics.Windows.Chart.AxisType.PrimaryY, 0);

    double y2 = Chart1.GetPosition(Infragistics.Windows.Chart.AxisType.PrimaryY, 10);

    Canvas canvas = Chart1.Scene.GridArea.Content as Canvas;

    Rectangle rect = new Rectangle();

    rect.Fill = Brushes.Red;

    Canvas.SetLeft(rect,x1);

    Canvas.SetTop(rect, y2);

    rect.Width = Math.Abs(x2 - x1);

    rect.Height = Math.Abs(y2 - y1);

    Canvas1.Children.Insert(0,rect);

    base.OnMouseDown(e);

    }