admin管理员组文章数量:1418080
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('.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=""></script>
<script type="text/javascript" src="//ajax.googleapis/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.
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./jsapi"></script>
<script type="text/javascript" src="//ajax.googleapis./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.
Share Improve this question edited Jan 24, 2014 at 15:33 Stelios Voskos asked Jan 24, 2014 at 13:17 Stelios VoskosStelios Voskos 5246 silver badges18 bronze badges1 Answer
Reset to default 4The JSON does not represent data which can be transformed to a 2-dimensional array
google.visualization.DataTablecan simply not interpret this. Each item contains plex subitems likelocationandoute_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.
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 oute_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].oute_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','oute 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].oute_status ? json[i].oute_status.category : "null");
dataTable.addRow(row);
}
本文标签： javascriptGoogle VisualizationInvalid row type for row 0Stack Overflow
版权声明：本文标题：javascript - Google Visualization-Invalid row type for row 0 - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745281856a2651468.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论