Google可视化 - 行0的行类型无效 [英] Google Visualization-Invalid row type for row 0
问题描述
我必须在谷歌可视化的饼图上可视化url json数据。我的代码似乎是因为它必须是为了这个目的，但我在控制台中得到'行0无效的行类型'错误。数据格式有问题吗？如果有人能够提供帮助，那将非常感激。以下是我的代码：
PHP：
<？php
$ json = file_get_contents（'http://data.police.uk/api/crimes-street/all-crime?lat=52.629729&lng=-1.131592&date=2013-01'）;
$ json = str_replace（\xe2\x80\xa8，'\\2020'，$ json）;
$ json = str_replace（\xe2\x80\xa9，'\\2020'，$ json）;
echo $ json;
？>
JavaScript：
< script type =text / javascriptsrc =https://www.google.com/jsapi>< / script>
< script type =text / javascript>
//加载可视化API和饼图包。
google.load（'visualization'，'1'，{'packages'：['corechart']}）;
//设置回调以在加载Google Visualization API时运行。
google.setOnLoadCallback（drawChart）;
函数drawChart（）{
var jsonData = $ .ajax（{
url：getData.php，
dataType：json，
async：false
}）。responseText;
//创建一个JSON数据数组，然后用从服务器加载的JSON数据创建我们的数据表。
var array = JSON.parse（jsonData）;
var dataTableData = new google.visualization.arrayToDataTable（array）;
var table = google.visualization.DataTable（dataTableData）;
var chart = new google.visualization.PieChart（document.getElementById（'chart_div'））;
chart.draw（data，{width：400，height：240}）;
}
< / script>
< / head>
< body>
< div id =chart_div>< / div>
< / body>
谢谢。
-
JSON不代表可以转换为二维数组
google.visualization的数据。 DataTable可以简单地不解释这一点。每个项目包含复杂的子项目，如位置和outcome_status。 -
您必须包含列 - arrayToDataTable对此非常具体 。
最重要的是：你怎么把这些数据想象成一个圆形图？第一级只有一个specfic number-field， The JSON does not represent data which can be transformed to a 2-dimensional array
google.visualization.DataTablecan simply not interpret this. Each item contains complex subitems likelocationandoutcome_status.You must include columns - arrayToDataTable is very specific about that.
The most important : How on earth do you imagine those data to be presented as a piechart? There is only one specfic number-field at first level,
location_subtype. You cannot produce a piechart based on various strings.
location_subtype 。您不能根据各种字符串生成饼图。但是，您可以清理数据并将其显示为 google.visualization.Table。
首先用一些列创建一个DataTable：
var dataTable = new google.visualization.DataTable（）;
dataTable.addColumn（'string'，'category'）;
dataTable.addColumn（'string'，'context'）;
dataTable.addColumn（'string'，'id'）;
dataTable.addColumn（'number'，'location_subtype'）;
dataTable.addColumn（'string'，'location_type'）;
dataTable.addColumn（'string'，'month'）;
dataTable.addColumn（'string'，'persistent_id'）;
将您的jsonData转换为JSON
var json = JSON.parse（jsonData）;
清理并插入数据。这里我只是删除位置和 outcome_status 子项目，但是您可能想要从这些子项目中提取值并插入它们作为 dataTable 中的列：
for（var i = 0; i< json.length; i ++）{
删除json [i] .location;
删除json [i] .outcome_status;
var row = [];
for（var item in json [i]）{
row.push（json [i] [item]）;
}
dataTable.addRow（row）;
$ / code>
最后创建Table（）：
var chart = new google.visualization.Table（document.getElementById（'chart_div'））;
chart.draw（dataTable，{width：1000，height：300}）;
结果将如下所示：
更新
var dataTable = new google.visualization.DataTable（） ;
dataTable.addColumn（'string'，'category'）;
dataTable.addColumn（'string'，'context'）;
dataTable.addColumn（'number'，'id'）;
dataTable.addColumn（'string'，'location_subtype'）;
dataTable.addColumn（'string'，'location_type'）;
dataTable.addColumn（'string'，'month'）;
dataTable.addColumn（'string'，'persistent_id'）;
dataTable.addColumn（'string'，'street name'）;
dataTable.addColumn（'string'，'结果状态'）;
json = JSON.parse（jsonData）;
for（var i = 0; i< json.length; i ++）{
var row = [];
row.push（json [i] .category）;
row.push（json [i] .context）;
row.push（json [i] .id）;
row.push（json [i] .location_subtype）;
row.push（json [i] .location_type）;
row.push（json [i] .month）;
row.push（json [i] .persistent_id）;
row.push（json [i] .location.street.name）;
row.push（json [i] .outcome_status？json [i] .outcome_status.category：null）;
dataTable.addRow（row）;
}
I have to visualize url json data on a pie chart with google visualization. My code seems to be as it has to be for the purpose, but I am getting an 'Invalid row type for row 0' error in the console. Is there any problem with the format of the data? If there is anyone that could help, that would be much appreciated. Here is my code:
PHP:
<?php
$json = file_get_contents('http://data.police.uk/api/crimes-street/all-crime?lat=52.629729&lng=-1.131592&date=2013-01');
$json = str_replace("\xe2\x80\xa8", '\\u2028', $json);
$json = str_replace("\xe2\x80\xa9", '\\u2029', $json);
echo $json;
?>
JavaScript:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart() {
var jsonData = $.ajax({
url: "getData.php",
dataType:"json",
async: false
}).responseText;
//Create an array of the JSON data and then create our data table out of JSON data loaded from server.
var array = JSON.parse(jsonData);
var dataTableData = new google.visualization.arrayToDataTable(array);
var table = google.visualization.DataTable(dataTableData);
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240});
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
Thank you.
解决方案
But, you can sanitize the data and show them as a google.visualization.Table :
First create a DataTable with some columns :
var dataTable = new google.visualization.DataTable();
dataTable.addColumn('string','category');
dataTable.addColumn('string','context');
dataTable.addColumn('string','id');
dataTable.addColumn('number','location_subtype');
dataTable.addColumn('string','location_type');
dataTable.addColumn('string','month');
dataTable.addColumn('string','persistent_id');
convert your jsonData to JSON
var json=JSON.parse(jsonData);
sanitize and insert the data. Here I just delete the location and outcome_status subitems, but you may want to extract values from those subitems instead and insert them as columns in the dataTable :
for (var i=0;i<json.length;i++) {
delete json[i].location;
delete json[i].outcome_status;
var row = [];
for (var item in json[i]) {
row.push(json[i][item]);
}
dataTable.addRow(row);
}
finally create the Table() :
var chart = new google.visualization.Table(document.getElementById('chart_div'));
chart.draw(dataTable, {width: 1000, height: 300});
the result will look like this :
update
var dataTable = new google.visualization.DataTable();
dataTable.addColumn('string','category');
dataTable.addColumn('string','context');
dataTable.addColumn('number','id');
dataTable.addColumn('string','location_subtype');
dataTable.addColumn('string','location_type');
dataTable.addColumn('string','month');
dataTable.addColumn('string','persistent_id');
dataTable.addColumn('string','street name');
dataTable.addColumn('string','outcome status');
json=JSON.parse(jsonData);
for (var i=0;i<json.length;i++) {
var row = [];
row.push(json[i].category);
row.push(json[i].context);
row.push(json[i].id);
row.push(json[i].location_subtype);
row.push(json[i].location_type);
row.push(json[i].month);
row.push(json[i].persistent_id);
row.push(json[i].location.street.name);
row.push(json[i].outcome_status ? json[i].outcome_status.category : "null");
dataTable.addRow(row);
}
这篇关于Google可视化 - 行0的行类型无效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
