Devexpress中WebChartControl控件柱状统计图的做法(数据为调用存储过程)

时间:2021-07-19 18:13:12

//前台控件代码:WebChartControl控件:

<%-- 月采购量统计--%>
<dxchartsui:WebChartControl ID="WebChartControl1" runat="server" Width="700px" Height="400px" CssClass="chartsui"></dxchartsui:WebChartControl>

后台代码(cs)可写在自定义方法中:

​// 柱状图里的第一个柱

Series Series1 = new Series("金额", ViewType.Bar);

Series1.DataSource = dt;

Series1.ArgumentScaleType = ScaleType.Qualitative;

// 以哪个字段进行显示

Series1.ArgumentDataMember = "ymonth";

Series1.ValueScaleType = ScaleType.Numerical;

// 柱状图里的柱的取值字段

Series1.ValueDataMembers.AddRange(new string[] { "SUM(AMONEY)" });

// 柱状图里的第二柱

Series Series2 = new Series("采购数量", ViewType.Bar);

Series2.DataSource = dt;

Series2.ArgumentScaleType = ScaleType.Qualitative;

Series2.ArgumentDataMember = "ymonth";

Series2.ValueScaleType = ScaleType.Numerical;

Series2.ValueDataMembers.AddRange(new string[] { "sum(buynum)" });

ChartServices.SetChartTitle(this.WebChartControl1, true, "采购量图表统计", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top, true, new Font("宋体", 12, FontStyle.Bold), Color.Red, 10);    //显示图表标题

for (int i = 0; i < dt.Rows.Count; i++)

{

// string tt = dt.Rows[i]["ymonth"].ToString();

SeriesPoint point1 = new SeriesPoint(dt.Rows[i]["ymonth"].ToString(), Convert.ToDouble(dt.Rows[i]["SUM(AMONEY)"].ToString()));

SeriesPoint point2 = new SeriesPoint(dt.Rows[i]["ymonth"].ToString(), Convert.ToDouble(dt.Rows[i]["sum(buynum)"].ToString()));

Series1.Points.Add(point1);

Series2.Points.Add(point2);

}

WebChartControl1.Series.Add(Series1);

WebChartControl1.Series.Add(Series2);

ChartServices类文件代码(用于设置WebChartControl中标题,颜色、值等属性)--一般在前端WebChartControl有自带的属性,有时点不出来时,则可以引用。

class ChartServices

{

///

/// 绘制图形

///

/// 图表控件

/// 系列名

/// 类型

/// 数据源

///

///

public static void DrawChart(DevExpress.XtraCharts.Web.WebChartControl control, string seriesName, ViewType type, DataTable dt, string column1, string column2)

{

Series series = new Series(seriesName, type);

DataTable table = dt;

SeriesPoint point = null;

for (int i = 0; i < table.Rows.Count; i++)

{

point = new SeriesPoint(table.Rows[i][column1].ToString(), Convert.ToDouble(table.Rows[i][column2].ToString()));

series.Points.Add(point);

}

control.Series.Add(series);

//针对饼图的特殊处理

if (type == ViewType.Pie)

{

//设置显示方式(Argument:显示图例说明,ArgumentAndValues:显示图例内容和数据)

series.Label.PointOptions.PointView = PointView.ArgumentAndValues;

//设置数据显示形式(Percent:百分比,Currency:货币类型,数据前添加¥,Scientific:科学计数法)

series.Label.PointOptions.ValueNumericOptions.Format = NumericFormat.Percent;

//数据是否保留小数(0:不保留小数位,1保留一位小数,2保留两位小数)

series.Label.PointOptions.ValueNumericOptions.Precision = 0;

//数据以百分比显示时只能是Default和None

((PieSeriesLabel)series.Label).ResolveOverlappingMode = ResolveOverlappingMode.Default;

}

}

///

/// 设置图表标题

///

/// 图表控件

/// /// 标题是否可见

/// 标题文本

/// 是否换行

/// 最大允许行数

/// 对齐方式

/// 位置

/// 是否允许设置外观

/// 字体

/// 文本颜色

/// 字体缩进值

public static void SetChartTitle(DevExpress.XtraCharts.Web.WebChartControl control, bool isVisible, String text, bool isWordWrop, int maxLineCount, StringAlignment alignment, ChartTitleDockStyle dock, bool isAntialiasing, Font font, Color textColor, int indent)

{

//设置标题

ChartTitle title = new ChartTitle();

title.Visible = isVisible;

//显示文本

title.Text = text;

//是否允许换行

title.WordWrap = isWordWrop;

//最大允许行数

title.MaxLineCount = maxLineCount;

//对齐方式

title.Alignment = alignment;

//位置

title.Dock = dock;

//是否允许设置外观

title.Antialiasing = isAntialiasing;

//字体

title.Font = font;

//字体颜色

title.TextColor = textColor;

//缩进值

title.Indent = indent;

control.Titles.Add(title);

}

///

/// 为X轴添加标题

///

/// 图形控件

/// 标题是否可见

/// 对齐方式

/// 标题显示文本

/// 标题字体颜色

/// 是否允许设置外观

/// 字体

public static void SetAxisX(DevExpress.XtraCharts.Web.WebChartControl control, bool isVisible, StringAlignment aligment, string text, Color color, bool isAntialiasing, Font font)

{

XYDiagram xydiagram = (XYDiagram)control.Diagram;

xydiagram.AxisX.Title.Visible = isVisible;

xydiagram.AxisX.Title.Alignment = aligment;

xydiagram.AxisX.Title.Text = text;

xydiagram.AxisX.Title.TextColor = color;

xydiagram.AxisX.Title.Antialiasing = isAntialiasing;

xydiagram.AxisX.Title.Font = font;

}

///

/// 为X轴添加标题

///

/// 图形控件

/// 标题是否可见

/// 对齐方式

/// 标题显示文本

/// 标题字体颜色

/// 是否允许设置外观

/// 字体

public static void SetAxisY(DevExpress.XtraCharts.Web.WebChartControl control, bool isVisible, StringAlignment aligment, string text, Color color, bool isAntialiasing, Font font)

{

XYDiagram xydiagram = (XYDiagram)control.Diagram;

xydiagram.AxisY.Title.Visible = isVisible;

xydiagram.AxisY.Title.Alignment = aligment;

xydiagram.AxisY.Title.Text = text;

xydiagram.AxisY.Title.TextColor = color;

xydiagram.AxisY.Title.Antialiasing = isAntialiasing;

xydiagram.AxisY.Title.Font = font;

}

}