设为首页 加入收藏

TOP

[深入浅出Windows 10]QuickCharts图表控件库解析(五)
2017-10-11 16:07:30 】 浏览:4996
Tags:深入浅出 Windows QuickCharts 图表 控件 解析
reaGraph控件。

    (5)使用SerialChart控件

    因为SerialChart控件是可以加载LineGraph、ColumnGraph和AreaGraph三种控件的,所以提供了一个Graphs属性,可以通过Graphs属性来添加多个图形。代码如下所示:

SerialChart.xaml文件主要代码
------------------------------------------------------------------------------------------------------------------
    <amq:SerialChart x:Name="chart1" DataSource="{Binding Data}" CategoryValueMemberPath="cat1" AxisForeground="White" PlotAreaBackground="Black" GridStroke="DarkGray">
        <amq:SerialChart.Graphs>
            <amq:LineGraph ValueMemberPath="val1" Title="Line #1" Brush="Blue" />
            <amq:ColumnGraph ValueMemberPath="val2" Title="Column #2" Brush="#8000FF00" ColumnWidthAllocation="0.4" />
            <amq:AreaGraph ValueMemberPath="val3" Title="Area #1" Brush="#80FF0000" />
        </amq:SerialChart.Graphs>
    </amq:SerialChart>
SerialChart.xaml.cs文件主要代码
------------------------------------------------------------------------------------------------------------------
    // 图表数据实体类
    public class TestDataItem
    {
        // cat1表示X轴的分类
        public string cat1 { get; set; }
        // 用来作为LineGraph图形的展示数据
        public double val1 { get; set; }
        // 用来作为ColumnGraph图形的展示数据
        public double val2 { get; set; }
        // 用来作为AreaGraph图形的展示数据
        public decimal val3 { get; set; }
    }
    private ObservableCollection<TestDataItem> _data = new ObservableCollection<TestDataItem>()
    {
        new TestDataItem() { cat1 = "cat1", val1=5, val2=15, val3=12},
        new TestDataItem() { cat1 = "cat2", val1=13.2, val2=1.5, val3=2.1M},
        new TestDataItem() { cat1 = "cat3", val1=25, val2=5, val3=2},
        new TestDataItem() { cat1 = "cat4", val1=8.1, val2=1, val3=8},
        new TestDataItem() { cat1 = "cat5", val1=8.1, val2=1, val3=4},
        new TestDataItem() { cat1 = "cat6", val1=8.1, val2=1, val3=10},
    };
    // 绑定的数据集合属性
    public ObservableCollection<TestDataItem> Data { get { return _data; } }
    private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
    {
        this.DataContext = this;
    }

本文来源于《深入浅出Windows 10通用应用开发》

源代码下载:http://vdisk.weibo.com/u/2186322691

目录:http://www.cnblogs.com/linzheng/p/5021428.html

欢迎关注我的微博@WP林政   微信公众号:wp开发(号:wpkaifa)

Windows10/WP技术交流群:284783431

首页 上一页 2 3 4 5 下一页 尾页 5/5/5
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇[UWP] 对应用进行A/B测试 下一篇WindowsPhone8解锁提示IpOverUsbS..

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目