我正在尝试根据此示例实施Google可视化气泡图。
工作演示 http://jsfiddle.net/jm83y5tL/3/
我将数据转换为json并想将json数据实现到函数中,但是它说表没有列。
不工作 http://jsfiddle.net/029jhgac/3/
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawSeriesChart);
function drawSeriesChart() {
var rawdata = '[["ID","Life Expectancy","Fertility Rate","Region","Population"],["CAN",80.66,1.67,"North America",33739900],["DEU",79.84,1.36,"Europe",81902307],["DNK",78.6,1.84,"Europe",5523095],["EGY",72.73,2.78,"Middle East",79716203],["GBR",80.05,2,"Europe",61801570],["IRN",72.49,1.7,"Middle East",73137148],["IRQ",68.09,4.77,"Middle East",31090763],["ISR",81.55,2.96,"Middle East",7485600],["RUS",68.6,1.54,"Europe",141850000],["USA",78.09,2.05,"North America",307007000]]';
// var testdata = JSON.parse(rawdata);
// console.log(data);
var data = new google.visualization.DataTable(rawdata);
var options = {
title: 'Correlation between life expectancy, fertility rate ' +
'and population of some world countries (2010)',
hAxis: {title: 'Life Expectancy'},
vAxis: {title: 'Fertility Rate'},
bubble: {textStyle: {fontSize: 11}}
};
var chart = new google.visualization.BubbleChart(document.getElementById('series_chart_div'));
chart.draw(data, options);
}
答案 0 :(得分:0)
为了直接从json创建数据表,
json必须采用特定格式,如此处所示
Format of the Constructor's JavaScript Literal data Parameter
否则,您可以使用-> arrayToDataTable
var data = google.visualization.arrayToDataTable(JSON.parse(rawdata));
请参阅以下工作片段...
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawSeriesChart);
function drawSeriesChart() {
var rawdata = '[["ID","Life Expectancy","Fertility Rate","Region","Population"],["CAN",80.66,1.67,"North America",33739900],["DEU",79.84,1.36,"Europe",81902307],["DNK",78.6,1.84,"Europe",5523095],["EGY",72.73,2.78,"Middle East",79716203],["GBR",80.05,2,"Europe",61801570],["IRN",72.49,1.7,"Middle East",73137148],["IRQ",68.09,4.77,"Middle East",31090763],["ISR",81.55,2.96,"Middle East",7485600],["RUS",68.6,1.54,"Europe",141850000],["USA",78.09,2.05,"North America",307007000]]';
var data = google.visualization.arrayToDataTable(JSON.parse(rawdata));
var options = {
title: 'Correlation between life expectancy, fertility rate ' +
'and population of some world countries (2010)',
hAxis: {title: 'Life Expectancy'},
vAxis: {title: 'Fertility Rate'},
bubble: {textStyle: {fontSize: 11}}
};
var chart = new google.visualization.BubbleChart(document.getElementById('series_chart_div'));
chart.draw(data, options);
}
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="series_chart_div" style="width: 900px; height: 500px;"></div>