OnMouseOver Animations

You can also create animations that execute when the user moves the mouse over elements. To do this, use the Loaded event as before, but this time attach event handlers to each PlotElement's mouse event instead of creating the animations directly.

For example:

void AnimatePoints()

{

  // Build chart as usual

  SalesPerMonthLineAndSymbol_Click(this, null);

 

  // Handle event when plot elements are created

  foreach (DataSeries ds in _c1Chart.Data.Children)

  {

    ds.Loaded += ds_Loaded;

  }

}

 

// Attach mouse event handlers to each plot element

// as they are created

void ds_Loaded(object sender, EventArgs e)

{

  PlotElement pe = sender as PlotElement;

  if (pe != null && pe.DataPoint.PointIndex > -1)

  {

    pe.MouseEnter += pe_MouseEnter;

    pe.MouseLeave += pe_MouseLeave;

  }

}

 

// Execute animations when the mouse enters or leaves

// each plot element

void pe_MouseEnter(object sender, MouseEventArgs e)

{

  AnimateDataPoint(sender as PlotElement, 3, 0.2);

}

void pe_MouseLeave(object sender, MouseEventArgs e)

{

  AnimateDataPoint(sender as PlotElement, 1, 1);

}

This code attaches event handlers that get called when the mouse enters or leaves each plot element. Both handlers call the AnimateDataPoint method, which increases the scale quickly when the mouse is over the element and restores it slowly when the mouse leaves the element.

Here is the implemenation of the AnimateDataPoint method:

void AnimateDataPoint(PlotElement plotElement, double scale, double duration)

{

  // Get/create scale transform for the PlotElement

  var st = plotElement.RenderTransform as ScaleTransform;

  if (st == null)

  {

    st = new ScaleTransform();

    plotElement.RenderTransform = st;

    plotElement.RenderTransformOrigin = new Point(0.5, 0.5);

  }

 

  // Create Storyboard and attach it to transform

  var sb = new Storyboard();

  Storyboard.SetTarget(sb, st);

 

  // Animate X and Y scales

  foreach (string prop in new string[] { "ScaleX", "ScaleY" })

  {

    var da = new DoubleAnimation();

    da.To = scale;

    da.Duration = new Duration(TimeSpan.FromSeconds(duration));

    da.SetValue(Storyboard.TargetPropertyProperty, new PropertyPath(prop));

    sb.Children.Add(da);

  }

 

  // Start animation

  sb.Begin();

}


Send us comments about this topic.
Copyright © GrapeCity, inc. All rights reserved.