BounceEase and silverlight 4 BarSeries

Question

Hi, I am trying to get a bar series to "bounce" when drawing, I assumed the BounceEase TransitionEasingFunction would do this but the lines just fade in, I have posted the xaml and code behind below, does anyone know where I have gone wrong or is it more complex than I though, I am fairly new to silverlight

XAML

<Grid x:Name="LayoutRoot" Background="White">
    <chartingToolkit:Chart x:Name="MyChart">
        <chartingToolkit:BarSeries Title="Sales" ItemsSource="{Binding}" IndependentValuePath="Name" DependentValuePath="Value" AnimationSequence="FirstToLast" TransitionDuration="00:00:3">
            <chartingToolkit:BarSeries.TransitionEasingFunction>
                <BounceEase EasingMode="EaseInOut" Bounciness="5" />
            </chartingToolkit:BarSeries.TransitionEasingFunction>
            <chartingToolkit:BarSeries.DataPointStyle>
                <Style TargetType="Control">
                    <Setter Property="Background" Value="Red"/>
                </Style>
            </chartingToolkit:BarSeries.DataPointStyle>
        </chartingToolkit:BarSeries>
        <chartingToolkit:Chart.Axes>
            <chartingToolkit:LinearAxis Title="Types owned"  Orientation="X" Minimum="0" Maximum="300" 
              Interval="10" ShowGridLines="True"  FontStyle='Italic'/>
        </chartingToolkit:Chart.Axes>
    </chartingToolkit:Chart>

</Grid>

code behind

public class MyClass : DependencyObject
    {
        public string Name { get; set; }
        public Double Value {
            get { return (Double)GetValue(myValueProperty); } 
            set{SetValue(myValueProperty,value);} 
        }
        public static readonly DependencyProperty myValueProperty =
            DependencyProperty.Register("Value", typeof(Double), typeof(MyClass), null);
    }

public MainPage()
        {
            InitializeComponent();
            //Get the data
            IList<MyClass> l = this.GetData();
            //Get a reference to the SL Chart

        MyChart.DataContext = l.OrderBy(e => e.Value);
        //Find the highest number and round it up to the next digit
        DispatcherTimer myDispatcherTimer = new DispatcherTimer();
        myDispatcherTimer.Interval = new TimeSpan(0, 0, 0, 5, 0); // 100 Milliseconds 
        myDispatcherTimer.Tick += new EventHandler(Each_Tick);
        myDispatcherTimer.Start();

    }
    public void Each_Tick(object o, EventArgs sender)
    {
        ((BarSeries)MyChart.Series[0]).DataContext = GetData();
    }

    private IList<MyClass> GetData()
    {
        Random random = new Random();

        return new List<MyClass>()
        {
            new MyClass() {Name="Bob Zero",Value=(random.NextDouble() * 100.0)},
             new MyClass() {Name="Bob One",Value=(random.NextDouble() * 100.0)},
              new MyClass() {Name="Bob Two",Value=(random.NextDouble() * 100.0)},
               new MyClass() {Name="Bob Three",Value=(random.NextDouble() * 100.0)}
        };
    }

Answer 1

The name BounceEase refers to how the value being animated is varied over the time of the animation. The BounceEase varies the value as you might imagine like a ball bouncing. The graphs in the documentation describe it.

The key point is that ultimately animations simply vary a value they don't really understand what the visual effect of varing the value is. In this case the value being animated is the DataPoint opacity. Hence with a bounce ease it appears to fade in a little then fade away then then fade a litte more and so on until it has completely faded in.

It would take quite a bit more work creating a new template for the DataPoint to get the effect you are after.