DevExpress的WebChartControl绘制饼状图，柱状图

先在aspx页面头部上注册

<span style="font-size:12px;"><%@ Register Assembly="DevExpress.XtraCharts.v11.1.Web, Version=11.1.6.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.XtraCharts.Web" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.XtraCharts.v11.1, Version=11.1.6.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.XtraCharts" TagPrefix="dx" %></span>

在aspx页面上加一个WebChartControl

<span style="font-size:12px;">          <dx:WebChartControl ID="WebChartControl1" runat="server" Visible="false" Style="font-family: Arial;
            font-size: 11px;" Height="400px" Width="800px">
          </dx:WebChartControl></span>

后台代码（写成一个方法，再进行调用）：

<span style="font-size:12px;">    private void CreateCustomerChart(DataTable dt, DevExpress.XtraCharts.Web.WebChartControl webChartContro, string title)
    {
        webChartContro.Series.Clear();
        if (dt.Rows.Count > 0)
        {
            Series series = new Series("客户分布", ViewType.Pie);//首先new一个对象
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                foreach (DataRow row in dt.Rows)//将传入的表dt中每行数据都加入进去
                {
                    SeriesPoint point = new SeriesPoint(row["PROBLEM_CN"].ToString(), row["Amount"].ToString());
                    series.Points.Add(point);
                }
            }

            webChartContro.Series.Add(series);

            //样式设置
            series.ArgumentScaleType = ScaleType.Qualitative;
            series.ValueScaleType = ScaleType.Numerical;

            ((PieSeriesView)series.View).Rotation = 90;//从90度方向开始
            series.PointOptions.ValueNumericOptions.Format = NumericFormat.Percent;//显示为百分比形式
            series.LegendPointOptions.PointView = PointView.Argument;//右边的图例
            series.PointOptions.PointView = PointView.ArgumentAndValues;//左边饼上的图例
            ((PiePointOptions)(series.PointOptions)).PercentOptions.PercentageAccuracy = 3;//保留三位小数

            ChartTitle CTitl = new ChartTitle();//加标题
            CTitl.Text = title;

            webChartContro.Titles.Clear();
            webChartContro.Titles.Add(CTitl);
            webChartContro.Visible = true;
        }
    }</span>

效果图：

如果要弄成柱状图的话，将后台代码中的        里的ViewType.Pie改为ViewType.Bar

类似这样的效果

如果要弄成两个柱状图一起显示，则要new两个对象

 Series series1 = new Series("2013", ViewType.Pie);//首先new一个对象
<pre name="code" class="csharp"> Series series2 = new Series("2014", ViewType.Pie);//首先new一个对象

//再对两个对象进行加数据  SeriesPoint point = new SeriesPoint(Argument,Values); series.Points.Add(point);

<pre name="code" class="csharp">//Argument就是横坐标显示的值 和 Value就是柱形的高度（就是值）。所以两个对象的Argument必须要相同

 webChartContro.Series.Add(series1);

 webChartContro.Series.Add(series2);