Spread支持 85 种丰富多彩的图表效果。基于工作表的数据直接生成图表,操作简单。同时,软件人员还可以在Visual Studio设计环境中定制图表的所有元素,包括标题、序列、轴、样式、图例等。
然而,很多刚刚接触 Spread 的用户在使用 FpChart 时由于所需设置元素太多头疼不已,这篇文章主要针对于 FpChart 初学者进行 FpChart 使用方法介绍。
下面分布讲解:
1.设置数据源
 
DataTable dt = new DataTable("Test");

            DataRow dr = default(System.Data.DataRow);

            dt.Columns.Add("名称");

            dt.Columns.Add("数量");



            dr = dt.NewRow();

            dr[0] = "电器";

            dr[1] = 0.2;

            dt.Rows.Add(dr);



            dr = dt.NewRow();

            dr[0] = "服装";

            dr[1] = 0.5;

            dt.Rows.Add(dr);



            dr = dt.NewRow();

            dr[0] = "家具";

            dr[1] = 0.3;

            dt.Rows.Add(dr);

复制代码
2.设置 BarSeries
 
FarPoint.Web.Chart.BarSeries series = new FarPoint.Web.Chart.BarSeries();

            //设置图表展示数据

            series.Values.DataSource = dt;

            series.Values.DataField = dt.Columns[1].ColumnName;

            

            //使用多样化颜色显示

            series.VaryColors = true;



            //设置 X 轴显示名称

            series.CategoryNames.Add("电器");

            series.CategoryNames.Add("服装");

            series.CategoryNames.Add("家具");

            series.LabelVisible = true;

复制代码
3.设置 YPlotArea
 
FarPoint.Web.Chart.YPlotArea plotArea = new FarPoint.Web.Chart.YPlotArea();

            //设置显示单位为 20%

            //plotArea.YAxes[0].DisplayUnits = 0.5;



            //设置 Y 轴显示为 Percentage

            plotArea.YAxes[0].LabelNumberFormat = "00.0%";



            //设置 YPlotArea 显示位置

            plotArea.Location = new System.Drawing.PointF(0.2F, 0.2F);

            //设置 YPlotArea 大小

            plotArea.Size = new System.Drawing.SizeF(0.6F, 0.6F);



            plotArea.Series.Add(series);

复制代码
4.设置图例
 
LegendArea legend = new LegendArea();

            legend.Location = new PointF(0.98f, 0.5f);

            legend.AlignmentX = 1.0f;

            legend.AlignmentY = 0.5f;

复制代码
5.设置图表标签
 
LabelArea label = new LabelArea();

            label.Text = "产品分布";

            label.Location = new PointF(0.5f, 0.02f);

            label.AlignmentX = 0.5f;

            label.AlignmentY = 0.0f;

复制代码
6.最后,在 WebConfig 文件中添加以下信息:
 
<httpHandlers>

      <add path="FpChart.axd" verb="*" type="FarPoint.Web.Chart.ChartImageHttpHandler" validate="true" />

    </httpHandlers>

复制代码
效果截图:


Demo 下载:VS 2010 && Spread for .NET 6 SP3
FpChartTest.zip (2.88 M, 下载次数:51)