动画

几乎所有的绘图区元素都可以使用内置的动画。使用内置动画选项简化了为C1Chart控件的绘图区元素创建各种不同的视觉动画效果的设置。包含在PlotElementAnimation类中的属性如下所示：

属性	描述
IndexDelay	一个附加属性，允许您指定按照元素点的索引不同，动画的延迟。
Storyboard	获取或设置应用到绘图区元素的storyboard。
SymbolStyle	获取或设置在 storyboard 开始之前应用到绘图区元素的符号样式。

对C1Chart控件应用动画还涉及到ChartData.LoadAnimation。

使用内置的动画选项设置动画效果，您可以使用下面的XAML标记：

XAML	拷贝代码
<c1chart:C1Chart Name="chart"> <c1chart:C1Chart.Data> <c1chart:ChartData> <c1chart:ChartData.LoadAnimation> <!-- 加载动画 --> <c1chart:PlotElementAnimation> <!-- 初始样式：不可见 --> <c1chart:PlotElementAnimation.SymbolStyle> <Style TargetType="c1chart:PlotElement"> <Setter Property="Opacity" Value="0" /> </Style> </c1chart:PlotElementAnimation.SymbolStyle> <c1chart:PlotElementAnimation.Storyboard> <Storyboard > <!-- 按照索引值不同延迟显示元素 --> <DoubleAnimation Storyboard.TargetProperty="Opacity" c1chart:PlotElementAnimation.IndexDelay="0.5" To="1" Duration="0:0:1" /> </Storyboard> </c1chart:PlotElementAnimation.Storyboard> </c1chart:PlotElementAnimation> </c1chart:ChartData.LoadAnimation> </c1chart:ChartData> </c1chart:C1Chart.Data> </c1chart:C1Chart>

XAML

拷贝代码

<c1chart:C1Chart Name="chart">
            <c1chart:C1Chart.Data>
                <c1chart:ChartData>
                    <c1chart:ChartData.LoadAnimation>
                        <!-- 加载动画 -->
                        <c1chart:PlotElementAnimation>
                            <!-- 初始样式：不可见  -->
                            <c1chart:PlotElementAnimation.SymbolStyle>
                                <Style TargetType="c1chart:PlotElement">
                                    <Setter Property="Opacity" Value="0" />
                                </Style>
                            </c1chart:PlotElementAnimation.SymbolStyle>
                            <c1chart:PlotElementAnimation.Storyboard>
                                <Storyboard >
                                   <!-- 按照索引值不同延迟显示元素 -->
                                    <DoubleAnimation
                   Storyboard.TargetProperty="Opacity"
                   c1chart:PlotElementAnimation.IndexDelay="0.5"
                   To="1" Duration="0:0:1" />
                                </Storyboard>
                            </c1chart:PlotElementAnimation.Storyboard>
                        </c1chart:PlotElementAnimation>
                    </c1chart:ChartData.LoadAnimation>
                </c1chart:ChartData>
            </c1chart:C1Chart.Data>
        </c1chart:C1Chart>

然后你可以将下面的代码直接插入在InitializeComponent()方法中：

C#	拷贝代码
var rnd = new Random(); chart.MouseLeftButtonDown += (s, e) => { chart.Data.Children.Clear(); // 创建新的数据 var vals = new double[rnd.Next(5, 10)]; for (int i = 0; i < vals.Length; i++) vals[i] = rnd.Next(0, 100); chart.Data.Children.Add(new DataSeries() { ValuesSource = vals }); };

拷贝代码

var rnd = new Random();
            chart.MouseLeftButtonDown += (s, e) =>
            {
                chart.Data.Children.Clear();
                // 创建新的数据
                var vals = new double[rnd.Next(5, 10)];
                for (int i = 0; i < vals.Length; i++)
                    vals[i] = rnd.Next(0, 100);
                chart.Data.Children.Add(new DataSeries() { ValuesSource = vals });
            };

当运行您的应用程序时，数据将在鼠标单击时加载或重新加载，显示在XAML标记中设置的动画效果。

查看其它

创建自定义动画