Question

I have chart in a canvas. when i click the chart i want it to zoom. i have this code.

<Canvas x:Name="SampleCanvas" Background="#F5F7F9"    MouseLeftButtonDown="brdMovable_MouseLeftButtonDown" MouseLeftButtonUp="brdMovable_MouseLeftButtonUp" MouseMove="brdMovable_MouseMove" Height="570" Width="875">
<chartingToolkit:Chart  x:Name="mcChart" Loaded="mcChart_Loaded"  Width="400" Height="250"  Canvas.Left="185" Canvas.Top="5"
     Background="LightSteelBlue">
    <chartingToolkit:Chart.RenderTransform>
        <ScaleTransform x:Name="scaleTransform"></ScaleTransform>
    </chartingToolkit:Chart.RenderTransform>
    <chartingToolkit:Chart.Series>
        <chartingToolkit:ColumnSeries Title="Experience"  IndependentValueBinding="{Binding Path=ModelName}" DependentValueBinding="{Binding  Path=SaleCount}">
        </chartingToolkit:ColumnSeries>
    </chartingToolkit:Chart.Series>
</chartingToolkit:Chart> 

In code behind

                Storyboard storyBoard = new Storyboard();

                ///////// X Transform
                DoubleAnimation ds = new DoubleAnimation();
                storyBoard.Children.Add(ds);
                ds.From  = 1;
                ds.To = 1.5;
                ds.Duration = new Duration(TimeSpan.FromSeconds(2));
                Storyboard.SetTargetName(ds, "scaleTransform");
                Storyboard.SetTargetProperty(ds, new PropertyPath("(ScaleX)"));

                ////Y Transform

                DoubleAnimation dsy = new DoubleAnimation();
                storyBoard.Children.Add(dsy);
                dsy.From = 1;
                dsy.To = 1.5;
                ds.Duration = new          Duration(TimeSpan.FromSeconds(3));
                Storyboard.SetTargetName(dsy, "scaleTransform");
                Storyboard.SetTargetProperty(dsy, new PropertyPath("(ScaleY)"));
                LayoutRoot.Resources.Remove("unique_id");
                LayoutRoot.Resources.Add("unique_id",storyBoard);

                storyBoard.Begin();

This is showing the output first in x direction then in y direction but i want both directions at a time. How can we do that ?

Thanks.

Answer 1

Took me a little while to spot the obvious 🙂 You have set the duration of your first animation twice (and the duration is different).

Should be:

dsy.Duration = new Duration(TimeSpan.FromSeconds(2));

not

ds.Duration = new Duration(TimeSpan.FromSeconds(3));