C# WPF DevExpress 图表控件之柱状图

 

说明：DevExpress版本是17.1。VS是2015。

XAML:

        <dxc:ChartControl x:Name="chartControl1">

            
            <dxc:ChartControl.Legend>

                
                <dxc:Legend Background="#fff"/>
                
                
            dxc:ChartControl.Legend>
            

            
            <dxc:ChartControl.Titles>
                <dxc:Title FontSize="14" FontFamily="微软雅黑" Foreground="#333" Content="XXX" HorizontalAlignment="Center"/>
            dxc:ChartControl.Titles>
            

            
            <dxc:XYDiagram2D SeriesDataMember="Name" BorderThickness="0">

                
                <dxc:XYDiagram2D.AxisX>

                    
                    <dxc:AxisX2D x:Name="BaraxisX">

                        
                        <dxc:AxisX2D.CustomLabels>
                            <dxc:CustomAxisLabel Content="0" Value="0"/>
                        dxc:AxisX2D.CustomLabels>
                        

                    dxc:AxisX2D>
                    

                dxc:XYDiagram2D.AxisX>
                

                
                <dxc:XYDiagram2D.AxisY>
                    
                    
                    <dxc:AxisY2D>

                        
                        <dxc:AxisY2D.CustomLabels>
                            <dxc:CustomAxisLabel Content="0" Value="0"/>
                            <dxc:CustomAxisLabel Content="300000" Value="300000"/>
                        dxc:AxisY2D.CustomLabels>
                        

                        
                        <dxc:AxisY2D.Title>
                            <dxc:AxisTitle Content="单位：亩" />
                        dxc:AxisY2D.Title>
                        

                        
                        <dxc:AxisY2D.WholeRange>
                            <dxc:Range MaxValue="600000" MinValue="0" AutoSideMargins="False"/>
                        dxc:AxisY2D.WholeRange>
                        

                    dxc:AxisY2D>
                    

                dxc:XYDiagram2D.AxisY>
                

                
                <dxc:XYDiagram2D.Series>
                    
                    
                    
                    
                    
                    
                    <dxc:BarSideBySideSeries2D x:Name="qwe" DisplayName="面积A" ArgumentDataMember="Name" ValueDataMember="Number" Brush="#EDA112">
                        
                        
                        
                        
                        
                        

                    dxc:BarSideBySideSeries2D>
                    

                    
                    
                    <dxc:BarSideBySideSeries2D x:Name="ewq" DisplayName="面积B" ArgumentDataMember="Name" ValueDataMember="Number" Brush="#7C2E16">
                        
                        
                        
                        
                    dxc:BarSideBySideSeries2D>
                    

                dxc:XYDiagram2D.Series>
                

            dxc:XYDiagram2D>
            

        dxc:ChartControl>
        

 

后台隐藏代码：

using DevExpress.Xpf.Charts;
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace WpfAppFirst
{
    /// 

    /// Histogram.xaml 的交互逻辑
    /// 
    public partial class Histogram : Window
    {
        //定义两个 类 ToList();
        List UserList1 = new List();
        List UserList2 = new List();

        /// 

        /// 构造函数
        /// 
        public Histogram()
        {
            #region 构造的数据
            Users us = new Users();
            string str1 = "Z地;A地;Y地;B地;X地;C地;W地;D地;V地;E地;U地;F地;T地";
            string str2 = "510000;450000;114000;54000;120000;60000;30000;12000;0;0;0;0;0";
            string str3 = "540000;450000;294000;126000;126000;60000;42000;12000;0;0;0;0;0";
            #endregion

            #region 向列表中添加构造的数据
            for (int i = 0; i < str1.Split(';').Length; i++)
            {
                UserList1.Add(new Users
                {
                    Name = str1.Split(';')[i],
                    Number = Convert.ToDouble(str2.Split(';')[i]),
                });
            }
            for (int i = 0; i < str1.Split(';').Length; i++)
            {
                UserList2.Add(new Users
                {
                    Name = str1.Split(';')[i],
                    Number = Convert.ToDouble(str3.Split(';')[i]),
                });
            }
            #endregion

            InitializeComponent();
        }

        /// 

        /// 窗体加载时事件
        /// 
        /// 
        /// 
        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            //将数据绑定到柱状图的BarSideBySideSeries2D 中
            this.qwe.DataSource = UserList1;
            this.ewq.DataSource = UserList2;
        }

        /// 

        /// 自定义类
        /// 
        public class Users
        {
            private string name;
            private double number;

            public string Name
            {
                get
                {
                    return name;
                }

                set
                {
                    name = value;
                }
            }

            public double Number
            {
                get
                {
                    return number;
                }

                set
                {
                    number = value;
                }
            }
        }
    }
}

效果图：

 

转载于:https://www.cnblogs.com/SeNaiTes/p/9396867.html