ASP.NET MVC：饼图不显示答案

【问题标题】：ASP.NET MVC : pie doesn't displayASP.NET MVC：饼图不显示
【发布时间】：2021-12-14 04:19:56
【问题描述】：

我正在尝试在 ASP.NET MVC 的 SQL Server 中使用 SyncFusion 绑定创建一个饼图，但是该图表不显示，当我重建代码并且它运行但没有图表显示时没有发现错误消息。我想知道图表无法加载的原因是什么

我尝试使用此代码将 Syncfusion 饼图连接到 SQL Server

string command2 = "SELECT * FROM [myTable] WHERE Item_ID < 10";

SqlCommand cmd1 = new SqlCommand(command2, con);
adapter.SelectCommand = cmd1;
adapter.Fill(dataset);

for (var i = 0; i < dataset.Tables[0].Rows.Count; i++)
{
    int x1 = (int)Convert.ToInt32(dataset.Tables[0].Rows[i]["this.Item_ID"]);
    int y1 = (int)Convert.ToInt32(dataset.Tables[0].Rows[i]["Item_Score"]);

    data.Add(new ChartSqlData(x1, y1));
}

CSHTML 视图：

 @(Html.EJS().AccumulationChart("container")

.Series(sr =>

 {

 sr.Type(Syncfusion.EJ2.Charts.AccumulationType.Pie)

.XName("Item_ID")

.YName("Item_Score")

.Name("Item_ID")

.Explode(true)

.DataLabel(dl => dl.Visible(true).Name("Item_ID").Position(Syncfusion.EJ2.Charts.AccumulationLabelPosition.Outside).ConnectorStyle(cs => cs.Type(Syncfusion.EJ2.Charts.ConnectorType.Line).Length("5 %")).Font(ft => ft.Size("14px")))

.Animation(animate => animate.Enable(true))

.Radius("70%")

.StartAngle(0)

.EndAngle(360)

.InnerRadius("0%")

.GroupTo("9")

.GroupMode(Syncfusion.EJ2.Charts.GroupModes.Point)

.DataSource(ViewBag.dataSource).Add();

 })

控制器：

List<ChartSqlData> data = new List<ChartSqlData>();

string connectionString = null;

SqlDataAdapter adapter = new SqlDataAdapter();
DataSet dataset = new DataSet();

connectionString = @"Data Source=LAPTOP-V3QJAMBF\SQLEXPRESS;Initial Catalog=My_Database;Integrated Security=True;";

SqlConnection con = new SqlConnection(connectionString);

con.Open();

string command2 = "SELECT * FROM [myTable] WHERE Item_ID < 10";

SqlCommand cmd1 = new SqlCommand(command2, con);

adapter.SelectCommand = cmd1;
adapter.Fill(dataset);

for (var i = 0; i < dataset.Tables[0].Rows.Count; i++)
{
    int x1 = (int)Convert.ToInt32(dataset.Tables[0].Rows[i]["this.Item_ID"]);
    int y1 = (int)Convert.ToInt32(dataset.Tables[0].Rows[i]["Item_Score"]);

    data.Add(new ChartSqlData(x1, y1));
}

ViewBag.dataSource = data;

return View();


[Serializable]
public class ChartSqlData
{
    public ChartSqlData(int xvalue, int yvalue1)
    {
        this.Item_ID = xvalue;
        this.Item_Score = yvalue1;
    }

    public int  Item_ID { get; set; }
    public int Item_Score { get; set; }
}

【问题讨论】：

标签： asp.net-mvc pie-chart syncfusion

【解决方案1】：

这是因为在控件创建结束时尚未调用 Render 方法。我已根据您的需要添加并准备了样本。请检查下面的 sn-p 和示例。

@(Html.EJS().AccumulationChart("container").Render())

示例：https://www.syncfusion.com/downloads/support/directtrac/general/ze/PieDB1343192459.zip

【讨论】：