google charts using .net wrapper производит ошибку «Стол не имеет столбцов»

Я использую Google.DataTable.Net.Wrapper для передачи данных JSON в диаграммы Google и попытаюсь создать линейную диаграмму. Звонок на мой веб-сервис - это передача JSON, который выглядит полностью действительным для меня, но я получаю сообщение «Стол без столбцов» от Google. Я слишком долго смотрел на это слишком долго и не понимаю, в чем проблема, поэтому любая помощь будет оценена по достоинству.google charts using .net wrapper производит ошибку «Стол не имеет столбцов»

Мой оказал JS код ниже:

<script type=text/javascript> 
    google.load("visualization", "1", { packages: ["corechart"] }); 
    google.setOnLoadCallback(drawChart); 


    function drawChart() { 
     var jsonData = $.ajax({ 
      type: "POST", 
      url: "ChartData.asmx/getChartData", 
      data: "{'numberToReturn': 'AvgPriceSqFt', 'parish': 'EBR', 'sub': 'AZALEA LAKES', 'timeFrame': '1Year'}", 
      dataType: "json", 
      contentType: "application/json; charset=utf-8", 
      async: false 
     }).responseText; 
     var data = new google.visualization.DataTable(jsonData, 0.6); 
     var options = { width: 1000, curveType: "function", vAxis: { maxValue: 200 }, 
      title: "Average Price Per Square Foot" 
     }; 
     var chart = new google.visualization.LineChart(document.getElementById('AvgPriceSqFt')); 
      chart.draw(data, options); 
     } 


    </script> 
    <div id="AvgPriceSqFt"></div>

JSON, который возвращается следующим образом (что выглядит вполне допустимо для меня)

{ 
"cols": 
    [ 
     {"type": "string" ,"id": "Date" }, 
     {"type": "number" ,"id": "AZALEA LAKES" } 
    ], 
"rows" : 
    [ 
     {"c" : [{"v": "01-2013"}, {"v": 128.6}]}, 
    {"c" : [{"v": "02-2013"}, {"v": 115.84}]}, 
    {"c" : [{"v": "03-2013"}, {"v": 113.7}]}, 
    {"c" : [{"v": "04-2013"}, {"v": 118.09}]}, 
    {"c" : [{"v": "06-2013"}, {"v": 97.01}]}, 
    {"c" : [{"v": "07-2013"}, {"v": 128.57}]}, 
    {"c" : [{"v": "08-2013"}, {"v": 98.57}]}, 
    {"c" : [{"v": "09-2013"}, {"v": 125.54}]} 
    ] 
}

В .NET код, который генерирует данные, используя обертка .NET выглядит следующим образом:

[WebMethod] 
     public string getChartData(string numberToReturn, string parish, string sub, string timeFrame) 
     { 
     google.DataTable gdt = new google.DataTable(); 
     sql.DataTable sdt = new sql.DataTable(); 

     gdt.AddColumn(new google.Column(google.ColumnType.String, "Date", "Date")); 
     gdt.AddColumn(new google.Column(google.ColumnType.Number, sub, "Subdivision")); 
     sdt = GetSqlData(numberToReturn, parish, sub, timeFrame); 
     for (int i = 0; i <= sdt.Rows.Count - 1; i++) 
     { 
      var row = gdt.NewRow(); 
      row.AddCellRange(new[] { 
       new google.Cell(sdt.Rows[i]["date"].ToString()), 
       new google.Cell(sdt.Rows[i]["number"].ToString()) 
      }); 
      gdt.AddRow(row); 
     } 



     return gdt.GetJson(); 
    }

источник

2014-01-07 Sara Morgan

Я использовал этот код и JSON, и он отлично работает для меня: http://jsfiddle.net/asgallant/8xsMt/. Отлаживайте свой код, чтобы убедиться, что 'jsonData' фактически содержит ваш JSON, и вы не получаете ошибку в вызове AJAX. – asgallant

Я отлаживал его несколько раз, и я не вижу, где проблема. Мне кажется, что переменная jsonData имеет все, что ей нужно. Я подозреваю, что это имеет какое-то отношение к тому, как страницы asp.net обрабатывают состояние просмотра, но я точно не знаю. У меня нет времени, поэтому я пошел вперед и придумал более простой способ приблизиться ко всему, что прекрасно работает. В конце концов, простота была лучшим подходом, я думаю. В очередной раз благодарим за помощь. Я ценю, что вы нашли время, чтобы проверить это. –

Возможно, это был идентификатор «Дата», который является зарезервированным словом Javascript? [Api docs] (https://google-developers.appspot.com/chart/interactive/docs/reference#dataparam), чтобы избежать этого, и поведение может быть специфичным для браузера. – scipilot

Наконец-то мне пришло в голову, что я делаю это много сложнее, чем нужно было, и я решил вернуться к принципу KISS (Keep It Simple Stupid). Это включало следующие изменения, в которых моя проблема была решена:

1.) Я избавился от кода, чтобы вызвать веб-службу getChartData и вернуть мои данные в виде JSON. Это также означает, что я больше не использую оболочку Google .NET Datatable.

2.) Я теперь программно генерирую Javascript для отображения таблицы Google и, следовательно, строя структуру arrayToDataTable (которая намного проще и менее чувствительна, чем предыдущая DataTable, которую я использовал).

динамически генерируемыми Javascript в настоящее время выглядит следующим образом, и мой Google Chart визуализируется:

google.load("visualization", "1", { packages: ["corechart"] }); 
google.setOnLoadCallback(drawChart); 

function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
    ['Date', 'AZALEA LAKES'], 
    ['01-2013', 128.6], 
    ['02-2013', 115.84], 
    ['03-2013', 113.7], 
    ['04-2013', 118.09], 
    ['06-2013', 97.01], 
    ['07-2013', 128.57], 
    ['08-2013', 98.57], 
    ['09-2013', 125.54]]); 

var options = {width: 1000, curveType: "function", vAxis: { maxValue: 200 }, 
      title: "Average Price Per Square Foot"}; 
var chart = new google.visualization.LineChart(document.getElementById('AvgPriceSqFt')); 
        chart.draw(data, options); }

Я только жалею, что потратил все это время пытается получить вызов веб-службы для работы. Какое время было ГИГАНТ. Урок для изучения. Просто потому, что кто-то делает что-то определенное в примере кода, не означает, что вы должны точно следовать ему. Если вы можете сделать это проще, сделайте это. Надеюсь, это поможет кому-то другому.

источник

2014-01-08 14:19:04

google charts using .net wrapper производит ошибку «Стол не имеет столбцов»

ответ

Смежные вопросы