zoukankan      html  css  js  c++  java
  • Silverlight Control(四)Chart (1) 初体验

    Chart在任何一个与统计有关的项目中都是必不可少的.Silverlight自带了Chart控件,也有不少第三方支持的控件,其中之一就是Visifire,不过现在已经收费了.

    的确Silverlight自带的Chart控件不如其他第三方控件那么华丽,但是在不需要刻意追求绚丽视觉效果的项目中Silverlight自带的Chart包含的功能已经是绰绰有余的了.

    好吧,进入正题,既然是初体验本章仅对最基本的四种类型进行介绍,点状图、线形图、柱状图和区域图(在后面会继续介绍饼图等其他类型图)。

    既然是介绍Chart那么Chart控件就是必不可少的咯,我们在页面中拖入Chart和radioButton,如下图:

    图表中最重要的就是数据了,OK我们来准备一套测试数据:

    publicclass DynamicData
    {
    publicdouble Point
    {
    get; set; }
    public DateTime Time
    {
    get; set; }
    }
    List<DynamicData> dynamicData =new List<DynamicData>();
    代码
    Random ra =new Random();

    for (int i =0; i <8; i++)
    {
    double value = ra.NextDouble();
    value
    = Math.Round(value, 2) *100;
    DynamicData dyData
    =new DynamicData
      { Point = value, Time = DateTime.Now.AddDays(i)};


    dynamicData.Add(dyData);s
    }

    这里随机生成了一些数据。

    有了数据,那么接下来就是数据绑定了。

    代码
    ScatterSeries scatterSeries =new ScatterSeries
    {
    ItemsSource
    =dynamicData,Title="点状图",
    IndependentValueBinding
    =new Binding("Time"), //X轴
    DependentValueBinding=new Binding("Point"), //Y轴

    };

    ScatterSeries是点类型对象,相应的还有LineSeriesColumnSeriesAreaSeriesPieSeries等。

    我们用ItemsSource属性进行数据绑定,IndependentValueBinding和DependentValueBinding分别指定X轴和Y轴绑定的数据对象。

    想要把数据显示在Chart中,我们当然还要把这些对象加载到Chart对象。

    myChart.Series.Add(scatterSeries);

    经过以上几个步骤,一个功能简单的Chart就完成了。另外我们可以设置一些样式,让它们看起来效果更好一些。

    关于样式的设置请看这里这里

    以下附上详细代码,相信对刚接触Silverlight的朋友会有帮助:

    代码
    <navigation:Page x:Class="MySilverlightTest.Control_Chart"
    xmlns
    ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x
    ="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d
    ="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc
    ="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable
    ="d"
    xmlns:navigation
    ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
    d:DesignWidth
    ="800" d:DesignHeight="600"
    Title
    ="myChart Page" xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit">
    <Grid x:Name="LayoutRoot">
    <chartingToolkit:Chart HorizontalAlignment="Left" Margin="12,49,0,0" Name="myChart" VerticalAlignment="Top" Height="539" Width="776"/>
    <Button Content="Button" Height="28" HorizontalAlignment="Left" Margin="12,12,0,0" Name="btnShow" VerticalAlignment="Top" Width="82" Click="btnShow_Click"/>
    <RadioButton Content="" Height="18" HorizontalAlignment="Left" Margin="132,17,0,0" Name="radioButtonScatter" VerticalAlignment="Top" Width="54" GroupName="Chart" IsChecked="True"/>
    <RadioButton Content="线" Height="18" HorizontalAlignment="Left" Margin="192,17,0,0" Name="radioButtonLine" VerticalAlignment="Top" Width="52" GroupName="Chart"/>
    <RadioButton Content="" Height="18" HorizontalAlignment="Left" Margin="255,17,0,0" Name="radioButtonColumn" VerticalAlignment="Top" Width="53" GroupName="Chart"/>
    <RadioButton Content="区域" GroupName="Chart" Height="18" HorizontalAlignment="Left" Margin="305,17,0,0" Name="radioButtonArea" VerticalAlignment="Top" Width="53"/>
    </Grid>
    </navigation:Page>
    代码
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;
    using System.Windows.Navigation;
    using System.Windows.Controls.DataVisualization.Charting;
    using System.Windows.Data;

    namespace MySilverlightTest
    {
    publicpartialclass Control_Chart : Page
    {
    publicclass DynamicData
    {
    publicdouble Point
    {
    get; set; }
    public DateTime Time
    {
    get; set; }
    }

    List
    <DynamicData> dynamicData =new List<DynamicData>();

    public Control_Chart()
    {
    InitializeComponent();
    Loaded
    +=new RoutedEventHandler(myChart_Loaded);
    }

    void myChart_Loaded(object sender, RoutedEventArgs e)
    {
    //定义平面图的样式
    Style plotAreaStyle =new System.Windows.Style(typeof(Grid));
    Setter setterPlotArea
    =new Setter(Grid.BackgroundProperty, new SolidColorBrush(Color.FromArgb(225, 255, 255, 200)));
    plotAreaStyle.Setters.Add(setterPlotArea);

    myChart.Title
    ="ChartDemo";
    myChart.Background
    =new SolidColorBrush(Color.FromArgb(100, 225, 225, 200));
    myChart.PlotAreaStyle
    = plotAreaStyle;
    }

    void BindData()
    {
    Style dataPointStyle
    =new System.Windows.Style();
    dataPointStyle.TargetType
    =typeof(System.Windows.Controls.Control);

    Style LegendStyle
    =new System.Windows.Style();
    LegendStyle.TargetType
    =typeof(System.Windows.Controls.Control);

    Setter setterDataRed
    =new Setter(System.Windows.Controls.Control.BackgroundProperty, new SolidColorBrush(Colors.Red));
    Setter setterLegendRed
    =new Setter(System.Windows.Controls.Control.BackgroundProperty, new SolidColorBrush(Colors.Red));
    dataPointStyle.Setters.Add(setterDataRed);
    LegendStyle.Setters.Add(setterLegendRed);

    ScatterSeries scatterSeries
    =new ScatterSeries
    {
    ItemsSource
    =dynamicData,Title="点状图",
    IndependentValueBinding
    =new Binding("Time"), //X轴
    DependentValueBinding=new Binding("Point"), //Y轴
    DataPointStyle = dataPointStyle, //点的样式
    LegendItemStyle
    = LegendStyle, //右边Legend的样式
    };

    LineSeries lineSeries
    =new LineSeries
    {
    ItemsSource
    = dynamicData,
    Title
    ="线形图",
    IndependentValueBinding
    =new Binding("Time"), //X轴
    DependentValueBinding =new Binding("Point"), //Y轴
    DataPointStyle = dataPointStyle,
    LegendItemStyle
    = LegendStyle,
    };

    ColumnSeries columnSeries
    =new ColumnSeries
    {
    ItemsSource
    = dynamicData,
    Title
    ="柱状图",
    IndependentValueBinding
    =new Binding("Time"), //X轴
    DependentValueBinding =new Binding("Point"), //Y轴
    DataPointStyle = dataPointStyle,
    LegendItemStyle
    = LegendStyle,
    };

    AreaSeries areaSeries
    =new AreaSeries
    {
    ItemsSource
    = dynamicData,
    Title
    ="区域图",
    IndependentValueBinding
    =new Binding("Time"), //X轴
    DependentValueBinding =new Binding("Point"), //Y轴
    DataPointStyle = dataPointStyle,
    LegendItemStyle
    = LegendStyle,
    };

    if (true== radioButtonScatter.IsChecked)
    myChart.Series.Add(scatterSeries);
    if (true== radioButtonLine.IsChecked)
    myChart.Series.Add(lineSeries);
    if (true== radioButtonColumn.IsChecked)
    myChart.Series.Add(columnSeries);
    if (true== radioButtonArea.IsChecked)
    myChart.Series.Add(areaSeries);

    IAxis datetimeAxis
    =new DateTimeAxis { Orientation=AxisOrientation.X,ShowGridLines=false,Title="时间" };
    IAxis valueAxis
    =new LinearAxis { Orientation=AxisOrientation.Y,ShowGridLines =true, Title="测试值" };

    myChart.Axes.Add(datetimeAxis);
    myChart.Axes.Add(valueAxis);
    }

    // Executes when the user navigates to this page.
    protectedoverridevoid OnNavigatedTo(NavigationEventArgs e)
    {
    }

    privatevoid btnShow_Click(object sender, RoutedEventArgs e)
    {
    dynamicData.Clear();
    myChart.Series.Clear();
    myChart.Axes.Clear();

    Random ra
    =new Random();

    for (int i =0; i <8; i++)
    {
    double value = ra.NextDouble();
    value
    = Math.Round(value, 2) *100;
    DynamicData dyData
    =new DynamicData { Point = value, Time = DateTime.Now.AddDays(i)};

    dynamicData.Add(dyData);
    }

    BindData();
    }

    }
    }

     更丰富的运用,请看这里

  • 相关阅读:
    Luogu 1080 【NOIP2012】国王游戏 (贪心,高精度)
    Luogu 1314 【NOIP2011】聪明的质检员 (二分)
    Luogu 1315 【NOIP2011】观光公交 (贪心)
    Luogu 1312 【NOIP2011】玛雅游戏 (搜索)
    Luogu 1525 【NOIP2010】关押罪犯 (贪心,并查集)
    Luogu 1514 引水入城 (搜索,动态规划)
    UVA 1394 And Then There Was One / Gym 101415A And Then There Was One / UVAlive 3882 And Then There Was One / POJ 3517 And Then There Was One / Aizu 1275 And Then There Was One (动态规划,思维题)
    Luogu 1437 [HNOI2004]敲砖块 (动态规划)
    Luogu 1941 【NOIP2014】飞扬的小鸟 (动态规划)
    HDU 1176 免费馅饼 (动态规划)
  • 原文地址:https://www.cnblogs.com/hades/p/1793847.html
Copyright © 2011-2022 走看看