首页 > 解决方案 > 来自数据库的 ASP.NET MVC AMCharts 动态

问题描述

我正在使用 SQL 查询将数据从数据库传递到 AMCharts 并将其放在 viewbag 上。但是没有输出。我试图在 JSON 上做到这一点,但我不知道它是如何运作的。

有人能指出我的代码有什么问题吗?或者帮我修一下。

这是我的模型:

public partial class Test
{
    public string wdsection { get; set; }
    public int secCount { get; set; }

}

这是我的代码:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<!--amcharts start here-->
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/pie.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<!--amchart end here-->

<div id="chartdiv"></div>

<script type="text/javascript">

    function createChart() {
        debugger;
        var chartData2 =
            [
                @ViewBag.DataPoints.ToString()
            ];
        var chartDataResults = new Array();
        $.ajax({
            type: 'POST',
            dataType: 'json',
            contentType: 'application/json',
            url: '@Url.Action("GetSecCount", "Home")',
            data: {},
            success: function (response) {
                var aData = response.dataPoints;
                
                for (var i = 0; i < aData.length; i++) {
                    var section = aData[i].wdsection;
                    alert(section);
                    chartDataResults.push({
                        wdsection: wdsection
                    });
                }

                // create the chart here
                // PIE CHART
                chart = new AmCharts.AmPieChart();

                // title of the chart
                chart.addLabel("0", "!20", "World", "center", 16);

                chart.backgroundAlpha = 0.4;
                chart.backgroundColor = "#000000";
                chart.dataProvider = chartDataResults;
                chart.titleField = "wdsection";
                chart.valueField = "secCount";
                chart.sequencedAnimation = true;
                chart.startEffect = "elastic";
                chart.labelsEnabled = false;
                chart.labelText = "[[title]]";
                chart.startDuration = 2;
                chart.labelRadius = 10;

                // WRITE
                chart.write("chartdiv");
            }
        });
    }

    $(document).ready(createChart);

</script>

这是我的控制器:

public ActionResult Index()
    {
        using (SqlConnection sqlcon = new SqlConnection(connstring))
        {
            List<Test> secCounts = new List<Test>();
            SqlCommand cmd = new SqlCommand("select a.wdsection,count(*) as secCount from DB_CIS.dbo.withdraw_tbl a, DB_CIS.dbo.item_tbl b where a.addqtyid = b.Item_ID and b.category = 'CONSUMABLES' group by wdsection", sqlcon);
            cmd.CommandType = CommandType.Text;
            cmd.CommandTimeout = 1000000;
            sqlcon.Open();
            SqlDataReader rdr = cmd.ExecuteReader();

            while (rdr.Read())
            {
                Test secs = new Test();
                secs.wdsection = rdr["wdsection"].ToString();
                secs.secCount = Convert.ToInt32(rdr["secCount"]);
                secCounts.Add(secs);
            }
            ViewBag.Locs = secCounts.ToList();
            ViewBag.DataPoints = JsonConvert.SerializeObject(secCounts.ToList(), _jsonSetting);
        }

标签: sqlasp.net-mvcamcharts

解决方案


推荐阅读