Javascript json文件到图表
我正在做一个从python中提取数据并在jsp仪表板中显示的项目。 我试图将一个json文件加载到chartjs中,但没有给出结果Javascript json文件到图表,javascript,json,parsing,chart.js,Javascript,Json,Parsing,Chart.js,我正在做一个从python中提取数据并在jsp仪表板中显示的项目。 我试图将一个json文件加载到chartjs中,但没有给出结果 <script> $.getJSON("resources/json_test.json", function(data) { var labels = data.department.map(function(e) { return e[1]; }); var data = data.volunteer.map(functi
<script>
$.getJSON("resources/json_test.json", function(data) {
var labels = data.department.map(function(e) {
return e[1];
});
var data = data.volunteer.map(function(e) {
return e[1];
});
var context = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(context, {
type : 'bar',
data : {
labels : labels,
datasets : [ {
label : 'volunteer',
lineTension : 0.1,
data : data,
backgroundColor : "rgba(255, 99, 132, 0.2)"
}]
}
});
要调用.map()
数据结构需要是一个数组,由于您的数据结构是对象,因此它不起作用,如果您将代码更改为此,它应该起作用:
const labels=Object.values(data.department)
const parsedData=Object.values(data.志愿者)
const context=document.getElementById('myChart').getContext('2d');
const myChart=新图表(上下文{
类型:'bar',
数据:{
标签:标签,
数据集:[{
标签:“志愿者”,
线张力:0.1,
数据:parsedData,
背景色:“rgba(255,99,132,0.2)”
}]
}
});
谢谢。已经解决了@那么请苏霍利。
{"department":{"0":"IT","1":"Math","2":"English","3":"Software","4":"Game"},"volunteer":{"0":409,"1":1781,"2":476,"3":550,"4":562}}