WPF、Silverlight項目中使用柱狀圖、餅狀圖、折線圖

在開發的過程當中，可能會遇到柱狀圖、餅狀圖、折線圖來更好的顯示數據，最近整理了一下，遂放出來望須要的朋友能夠參考。本文僅僅是簡單顯示，如需複雜顯示效果請參考官網代碼示例。----本文代碼使用WPF，Silverlight相似代碼，使用第三方wpf_visifire_v5.1.2-0_trial控件。

後續會放上Html5示例。

代碼下載地址：代碼下載

 

先放上一組截圖吧：

公共數據：

private List<string> strListx = new List<string>() { "蘋果", "櫻桃", "菠蘿", "香蕉", "榴蓮", "葡萄", "桃子", "獼猴桃" };
        private List<string> strListy = new List<string>() { "13", "75", "60", "38", "97", "22", "39", "80" };

        private List<DateTime> LsTime = new List<DateTime>()
            { 
               new DateTime(2012,1,1),
               new DateTime(2012,2,1),
               new DateTime(2012,3,1),
               new DateTime(2012,4,1),
               new DateTime(2012,5,1),
               new DateTime(2012,6,1),
               new DateTime(2012,7,1),
               new DateTime(2012,8,1),
               new DateTime(2012,9,1),
               new DateTime(2012,10,1),
               new DateTime(2012,11,1),
               new DateTime(2012,12,1),
            };
        private List<string> cherry = new List<string>() { "33", "75", "60", "98", "67", "88", "39", "45", "13", "22", "45", "80" };
        private List<string> pineapple = new List<string>() { "13", "34", "38", "12", "45", "76", "36", "80", "97", "22", "76", "39" };

　　柱狀圖：

public void CreateChartColumn(string name, List<string> valuex, List<string> valuey)
        {
            //建立一個圖標
            Chart chart = new Chart();

            //設置圖標的寬度和高度
            chart.Width = 580;
            chart.Height = 380;
            chart.Margin = new Thickness(100, 5, 10, 5);
            //是否啓用打印和保持圖片
            chart.ToolBarEnabled = false;

            //設置圖標的屬性
            chart.ScrollingEnabled = false;//是否啓用或禁用滾動
            chart.View3D = true;//3D效果顯示

            //建立一個標題的對象
            Title title = new Title();

            //設置標題的名稱
            title.Text = Name;
            title.Padding = new Thickness(0, 10, 5, 0);

            //向圖標添加標題
            chart.Titles.Add(title);

            Axis yAxis = new Axis();
            //設置圖標中Y軸的最小值永遠爲0           
            yAxis.AxisMinimum = 0;
            //設置圖表中Y軸的後綴          
            yAxis.Suffix = "斤";
            chart.AxesY.Add(yAxis);

            // 建立一個新的數據線。               
            DataSeries dataSeries = new DataSeries();

            // 設置數據線的格式
            dataSeries.RenderAs = RenderAs.StackedColumn;//柱狀Stacked


            // 設置數據點              
            DataPoint dataPoint;
            for (int i = 0; i < valuex.Count; i++)
            {
                // 建立一個數據點的實例。                   
                dataPoint = new DataPoint();
                // 設置X軸點                    
                dataPoint.AxisXLabel = valuex[i];
                //設置Y軸點                   
                dataPoint.YValue = double.Parse(valuey[i]);
                //添加一個點擊事件        
                dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
                //添加數據點                   
                dataSeries.DataPoints.Add(dataPoint);
            }

            // 添加數據線到數據序列。                
            chart.Series.Add(dataSeries);

            //將生產的圖表增長到Grid，而後經過Grid添加到上層Grid.           
            Grid gr = new Grid();
            gr.Children.Add(chart);
            Simon.Children.Add(gr);
        }

View Code

　　餅狀圖：

public void CreateChartPie(string name, List<string> valuex, List<string> valuey)
        {
            //建立一個圖標
            Chart chart = new Chart();

            //設置圖標的寬度和高度
            chart.Width = 580;
            chart.Height = 380;
            chart.Margin = new Thickness(100, 5, 10, 5);
            //是否啓用打印和保持圖片
            chart.ToolBarEnabled = false;

            //設置圖標的屬性
            chart.ScrollingEnabled = false;//是否啓用或禁用滾動
            chart.View3D = true;//3D效果顯示

            //建立一個標題的對象
            Title title = new Title();

            //設置標題的名稱
            title.Text = name;
            title.Padding = new Thickness(0, 10, 5, 0);

            //向圖標添加標題
            chart.Titles.Add(title);

            //Axis yAxis = new Axis();
            ////設置圖標中Y軸的最小值永遠爲0           
            //yAxis.AxisMinimum = 0;
            ////設置圖表中Y軸的後綴          
            //yAxis.Suffix = "斤";
            //chart.AxesY.Add(yAxis);

            // 建立一個新的數據線。               
            DataSeries dataSeries = new DataSeries();

            // 設置數據線的格式
            dataSeries.RenderAs = RenderAs.Pie;//柱狀Stacked


            // 設置數據點              
            DataPoint dataPoint;
            for (int i = 0; i < valuex.Count; i++)
            {
                // 建立一個數據點的實例。                   
                dataPoint = new DataPoint();
                // 設置X軸點                    
                dataPoint.AxisXLabel = valuex[i];

                dataPoint.LegendText = "##" + valuex[i];
                //設置Y軸點                   
                dataPoint.YValue = double.Parse(valuey[i]);
                //添加一個點擊事件        
                dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
                //添加數據點                   
                dataSeries.DataPoints.Add(dataPoint);
            }

            // 添加數據線到數據序列。                
            chart.Series.Add(dataSeries);

            //將生產的圖表增長到Grid，而後經過Grid添加到上層Grid.           
            Grid gr = new Grid();
            gr.Children.Add(chart);
            Simon.Children.Add(gr);
        }

View Code

　　折線圖：

public void CreateChartSpline(string name, List<DateTime> lsTime, List<string> cherry, List<string> pineapple)
        {
            //建立一個圖標
            Chart chart = new Chart();

            //設置圖標的寬度和高度
            chart.Width = 580;
            chart.Height = 380;
            chart.Margin = new Thickness(100, 5, 10, 5);
            //是否啓用打印和保持圖片
            chart.ToolBarEnabled = false;

            //設置圖標的屬性
            chart.ScrollingEnabled = false;//是否啓用或禁用滾動
            chart.View3D = true;//3D效果顯示

            //建立一個標題的對象
            Title title = new Title();

            //設置標題的名稱
            title.Text = name;
            title.Padding = new Thickness(0, 10, 5, 0);

            //向圖標添加標題
            chart.Titles.Add(title);

            //初始化一個新的Axis
            Axis xaxis = new Axis();
            //設置Axis的屬性
            //圖表的X軸座標按什麼來分類，如時分秒
            xaxis.IntervalType = IntervalTypes.Months;
            //圖表的X軸座標間隔如2,3,20等，單位爲xAxis.IntervalType設置的時分秒。
            xaxis.Interval = 1;
            //設置X軸的時間顯示格式爲7-10 11：20           
            xaxis.ValueFormatString = "MM月";
            //給圖標添加Axis            
            chart.AxesX.Add(xaxis);

            Axis yAxis = new Axis();
            //設置圖標中Y軸的最小值永遠爲0           
            yAxis.AxisMinimum = 0;
            //設置圖表中Y軸的後綴          
            yAxis.Suffix = "斤";
            chart.AxesY.Add(yAxis);


            // 建立一個新的數據線。               
            DataSeries dataSeries = new DataSeries();
            // 設置數據線的格式。               
            dataSeries.LegendText = "櫻桃";

            dataSeries.RenderAs = RenderAs.Spline;//折線圖

            dataSeries.XValueType = ChartValueTypes.DateTime;
            // 設置數據點              
            DataPoint dataPoint;
            for (int i = 0; i < lsTime.Count; i++)
            {
                // 建立一個數據點的實例。                   
                dataPoint = new DataPoint();
                // 設置X軸點                    
                dataPoint.XValue = lsTime[i];
                //設置Y軸點                   
                dataPoint.YValue = double.Parse(cherry[i]);
                dataPoint.MarkerSize = 8;
                //dataPoint.Tag = tableName.Split('(')[0];
                //設置數據點顏色                  
                // dataPoint.Color = new SolidColorBrush(Colors.LightGray);                   
                dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
                //添加數據點                   
                dataSeries.DataPoints.Add(dataPoint);
            }

            // 添加數據線到數據序列。                
            chart.Series.Add(dataSeries);


            // 建立一個新的數據線。               
            DataSeries dataSeriesPineapple = new DataSeries();
            // 設置數據線的格式。         

            dataSeriesPineapple.LegendText = "菠蘿";

            dataSeriesPineapple.RenderAs = RenderAs.Spline;//折線圖

            dataSeriesPineapple.XValueType = ChartValueTypes.DateTime;
            // 設置數據點              

            DataPoint dataPoint2;
            for (int i = 0; i < lsTime.Count; i++)
            {
                // 建立一個數據點的實例。                   
                dataPoint2 = new DataPoint();
                // 設置X軸點                    
                dataPoint2.XValue = lsTime[i];
                //設置Y軸點                   
                dataPoint2.YValue = double.Parse(pineapple[i]);
                dataPoint2.MarkerSize = 8;
                //dataPoint2.Tag = tableName.Split('(')[0];
                //設置數據點顏色                  
                // dataPoint.Color = new SolidColorBrush(Colors.LightGray);                   
                dataPoint2.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
                //添加數據點                   
                dataSeriesPineapple.DataPoints.Add(dataPoint2);
            }
            // 添加數據線到數據序列。                
            chart.Series.Add(dataSeriesPineapple);

            //將生產的圖表增長到Grid，而後經過Grid添加到上層Grid.           
            Grid gr = new Grid();
            gr.Children.Add(chart);
            
            Simon.Children.Add(gr);
        }

View Code