我尝试使用charts.js和json api呈现图表,但呈现的图表仅显示json中的前x和y值
使用xmlhttp提取json
var url = "https://syed1ahmed.github.io/stage-gear/api.json";
xmlhttp.open("GET", url, true);
xmlhttp.send();
xmlhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var data = JSON.parse(this.responseText);
date = data.data.map(function (elem) {
return elem.x;
})
volume = data.data.map(function (elem) {
return elem.y;
})
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: date,
datasets: [{
label: 'daily volume in USD',
data: volume,
backgroundColor: 'rgba(255, 99, 132, 1)'
}]
},
options: {
scales: {
y: {
}
}
}
});
}
}
json应用程序接口链接https://syed1ahmed.github.io/stage-gear/api.json
1条答案
按热度按时间v09wglhw1#
Chart.js
似乎无法识别您的值中的千位分隔符(,
)。您可以通过使用replaceAll()
将其删除来解决此问题,如下所示:请查看修改后的代码(没有
HTTP
调用),看看它是如何工作的。第一个