Question

我试图让谷歌条形图从一个简单的数据库中获取两个值并显示在图表中。我可以显示数组中的值，但是当我尝试使用ajax从数据库获取数据时，它将无法获取值。（我能够在索引中打印值）。

注意：嘿那里我正在尝试熟悉javascript并使用谷歌图表。我查了几乎所有我能找到的东西仍然无法解决我的问题。这是我对stackoverflow的第一个问题。请帮忙。

我有一个简单的数据库，只有4个值代表一个公司的cashIn和cashOut超过12个月。

我创建了一个MVC Web应用程序，然后将数据库添加到其中。这是控制器类

1.123e-4: [p=15,l=9] 0.0001123
1.123e-5: [p=11,l=9] 1.123e-05
1.123e-99: [p=11,l=9] 1.123e-99
1.123e-100: [p=10,l=10] 1.123e-100
7.105427357601002e-14: [p=11,l=16] 7.1054273576e-14
7.105427357621342e-14: [p=11,l=16] 7.1054273576e-14
-7.105427357601002e-14: [p=10,l=16] -7.105427358e-14
-7.105427357621342e-14: [p=10,l=16] -7.105427358e-14
7.105427357621342e14: [p=15,l=15] 710542735762134
7.105427357621342e15: [p=16,l=16] 7105427357621342
7.105427357621342e16: [p=11,l=16] 7.1054273576e+16
-7.105427357621342e14: [p=15,l=16] -710542735762134
-7.105427357621342e15: [p=10,l=16] -7.105427358e+15
7.105427357621342e15: [p=16,l=16] 7105427357621342
7.105427357621342e16: [p=11,l=16] 7.1054273576e+16
-7.105427357621342e15: [p=10,l=16] -7.105427358e+15
1.123e14: [p=15,l=15] 112300000000000
1.123e15: [p=16,l=16] 1123000000000000
1e15: [p=16,l=16] 1000000000000000
1e16: [p=11,l=5] 1e+16
-1e15: [p=10,l=6] -1e+15
-1e14: [p=15,l=16] -100000000000000
1.2345678901234567890e-14: [p=11,l=16] 1.2345678901e-14

这是索引视图类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using WebApplication2.Models;

namespace WebApplication2.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            DenemeDataEntities db= new DenemeDataEntities();

            List<GelirGider > gelirList = db.GelirGiders.ToList();
            Array gelirArray = db.GelirGiders.ToArray();

            //return Json(gelirList, JsonRequestBehavior.AllowGet);
            //return Json(gelirList, JsonRequestBehavior.AllowGet);
            return View(gelirList);
        }

        public ActionResult Index2()
        {
            DenemeDataEntities db = new DenemeDataEntities();

            List<GelirGider> gelirList = db.GelirGiders.ToList();
            //Array gelirArray = db.GelirGiders.ToArray();


           return Json(gelirList, JsonRequestBehavior.AllowGet);
            //return View(gelirList);
        }

        public ActionResult About()
        {
            ViewBag.Message = "Your application description page.";

            return View();
        }

        public ActionResult Contact()
        {
            ViewBag.Message = "Your contact page.";

            return View();
        }
    }
}

我相信这条线无法获取数据因此无法将数据输入到图表中。我尝试了一些简单的缩进错误的其他组合，但再次没有奏效 data.addRows（[item.Ay，item.Gelir]）

请帮忙。我试着尽可能清楚。提前致谢

Answer 1

您的代码中似乎有几个问题：

为Ajax响应对象和Google图表数据对象使用相同的名称。
Google Charts Datatable.AddRows（）方法接收数组对象数组，并且不接受单个数组。
您再次使用每个声明中新创建的Google图表数据表

我已根据之前的观点更新了Ajax代码：

            $.ajax({
                url: '/Home/Index2',
                type: 'POST',
                dataType: 'json',
                success: function (response) {
                    var data = new google.visualization.DataTable();
                    data.addColumn('string', 'Ay');
                    data.addColumn('number', 'Gelir');
                    var arr = [];
                    $.each(response, function (i, item) {
                        arr.push([ item.Ay ,item.Gelir]);
                    });
                    data.addRows(arr);
                    // Set chart options
                    var options = {
                        'title': 'How Much Pizza I Ate Last Night',
                        'width': 400,
                        'height': 300
                    };
                    // Instantiate and draw our chart, passing in some options.
                    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
                    chart.draw(data, options);
                }
            });

使用Ajax从数据库填充Google Chart

1 个答案: