我点击链接后试图调用谷歌图表.这就是我的功能:
function getGraphData(id) {
var ajax_url = '<?=URL?>ajaxlibrary/get-graph-data';
$.ajax({
type: 'POST',url: ajax_url,dataType: 'html',data: ({
id : id
}),cache: false,success: function(data) {
$('a').removeClass("selected");
$('#link_'+id).addClass("selected");
alert(data);
},});
}
所以我在这里想要实现的是为不同的类似物加载不同的图形,所以假设我有政治图表,体育图表等.我不知道在哪里放置Google Api代码,因为它似乎是只是不工作……
编辑:
我编辑了这样的函数:
$.ajax({
type: "POST",dataType: "html",data: {id: id},url: '<?=URL?>' + 'ajaxlibrary/get-charts',success: function(datas) {
console.log(datas);
var data = google.visualization.arrayToDataTable([
datas
]);
var options = {
title: 'My Daily Activities'
};
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data,options);
}
});
但我从我的ajax PHP文件发送此数据流时遇到问题:
echo '[\'Task\',\'Hours per Day\'],[\'Work\',10],[\'shit\',50],[\'loop\',25],[\'poop\',15]';
响应不是有效的2D数组.如果我手动将值放在javascript文件中,它会起作用,因此问题出在响应中的某个位置.
解决方法
您可以使用以下代码加载带有Ajax调用的Google Charts.
$.ajax({
url: 'https://www.google.com/jsapi?callback',cache: true,dataType: 'script',success: function(){
google.load('visualization','1',{packages:['corechart'],'callback' : function()
{
$.ajax({
type: "POST",dataType: "json",data: {id: YOURIDHERE},success: function(jsondata) {
var data = google.visualization.arrayToDataTable(jsondata);
var options = {title: 'My Daily Activities'};
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data,options);
}
});
]);
}
});
return true;
}
});
您可以使用Google Api加载任何其他图表类型,而不仅仅是核心图表.