gpt4 book ai didi

javascript - 使用 Jquery 的图表

转载 作者:行者123 更新时间:2023-11-28 07:07:16 24 4
gpt4 key购买 nike

我想用jquery,html,css设计一个饼图怎么办?如何使用代码获取饼图表示形式的每日报告。经过泰迦

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
var test=new Array();
function drawChart() {
var jsonData = $.ajax({
url:'getData.php',
type:'GET',
dataType:'json',
contentType: 'application/x-www-form-urlencoded',
async:false,
success: function(data){
test=data;
}
}).responseText;
//alert(test);
var data = google.visualization.arrayToDataTable(test);

var options = {
title: 'My Daily Activities',
pieHole: 0.6,
};

var chart = new google.visualization.PieChart(document.getElementById('piechart'));

chart.draw(data, options);
}
</script>
</head>
<body>
<div id="piechart" style="width: 900px; height: 500px;"></div>
</body>
</html>

我无法得到任何输出我正在使用不同的文件获取所有 json 数据,并在我的代码中使用 Ajax 代码获取 json 数据...是否有其他方法可以解决此问题。

最佳答案

你似乎没有得到任何东西,因为 $.ajax 是异步的,这意味着当你调用它时,它会启动一个请求,然后立即继续下一条语句(在任何数据之前甚至返回)

如果一切顺利,您最终会使用分配给 success 的方法。那就是您应该绘制图表的地方。

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

function drawChart() {
$.ajax({
url:'getData.php',
type:'GET',
dataType:'json',
contentType: 'application/x-www-form-urlencoded',
async:false,
success: function(data){
var options = {
title: 'My Daily Activities',
pieHole: 0.6,
};
var chart = new google.visualization.PieChart(document.getElementById('piechart'));
var dataAsDataTable = google.visualization.arrayToDataTable(data);
chart.draw(dataAsDataTable, options);
}
});
}


//typically it is a good idea to define functions or variables *before*
//passing them as a reference. i am not quite sure what the code below will do,
//but since it references the drawChart function, it should be executed after
//defining drawChart.

google.setOnLoadCallback(drawChart);

关于javascript - 使用 Jquery 的图表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32860132/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com