图表未显示所有数据

时间:2016-11-01 05:48:13

标签: c# asp.net .net asp.net-mvc charts

所以我刚开始学习MVC,我正在学习制作图形。 我试图从SQL服务器提取数据并将其放在X和Y轴。 我的问题是,在y轴上,它填充直到我的数据库结束,但我的x轴只显示数据库中的1个数据。 或者我做错了什么? 帮忙。 TQVM。

控制器代码:

json.loads()

查看代码:

public ActionResult MyBarGraph()
    {
        DB.Open();
        DataTable data = DB.GetTable("SELECT * FROM tblproduct");
        DB.Close();
        Chart c = new Chart(width: 800, height: 200);
        foreach(DataRow item in data.Rows)
        {
            c.AddSeries(
            chartType: "column",
            xValue: new[] {item["productname"]},
            yValues: new[] { item["quantity"] });
        }
        c.Write("png");

        return null;
    }

图片:

only Apple is shown

更新图像:

new problem

2 个答案:

答案 0 :(得分:1)

您为每个系列添加了一系列只有一列的系列。

填充数据的正确方法应该是:

    c.Series.Add("srs");
    foreach(DataRow item in data.Rows)
    {
        C.Series["srs"].Points.Add(item["productname"], item["quantity"]);
    }

这样,每个数据行都会有一列。

答案 1 :(得分:1)

您应该使用以下语法:

            var myChart = new Chart(width: 600, height: 400)
            .AddTitle("Product Chart")
            .AddSeries(
            name: "Products",
            xValue: data.AsDataView(), xField: "productname",
            yValues: data.AsDataView(), yFields: "quantity")
            .Save("~/Images/Chart01.png", "png");

enter image description here

编辑:要自定义标签,您需要将Theme文件传递到图表,如下所示:

            var myChart = new Chart(width: 600, height: 400, themePath: "MyTheme.xml")
            .AddTitle("Product Chart")
            .AddSeries(
            name: "Products",
            xValue: data.AsDataView(), xField: "productname",
            yValues: data.AsDataView(), yFields: "quantity")
            .Save("~/Images/Chart01.png", "png");

MyTheme.xml文件添加到项目的根文件夹中,其中包含以下内容:

<?xml version="1.0" encoding="utf-8" ?>
<Chart>
  <ChartAreas>
    <ChartArea Name="Default">
      <AxisX IsLabelAutoFit="false">
        <LabelStyle Angle="-90" Interval="1"></LabelStyle>
      </AxisX>
    </ChartArea>
  </ChartAreas>
</Chart>

enter image description here