将JSON数据解析为Chart.js条形图
将JSON数据解析为Chart.js条形图
提问于 2019-03-22 06:42:58
我正在尝试使用Chart.js生成一个条形图，该条形图使用Oracle DB中动态生成的数据。我在获取正确格式的数据方面遇到了困难，我想我已经接近了，但我已经被卡住了一段时间。
我的JSON文件：
[{"REGION":"Poland","REV_VALUE":"2263"},{"REGION":"United States","REV_VALUE":"1961"},{"REGION":"Spain","REV_VALUE":"555"},{"REGION":"United Kingdom","REV_VALUE":"380"},{"REGION":"Germany","REV_VALUE":"314"}]，这是我的barchar.js文件：
$(document).ready(function(){
$.ajax({
url: "http://localhost/DWH/dataJSON.php",
method: "GET",
dataType : 'JSON',
success: function(data) {
console.log(data);
var region = [];
var value = [];
for(var i in data) {
region.push(data[i].REGION);
value.push(data[i].REV_VALUE);
}
var chartdata = {
labels: region,
datasets : [
{
label: 'Region',
backgroundColor: 'rgba(200, 200, 200, 0.75)',
borderColor: 'rgba(200, 200, 200, 0.75)',
hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
hoverBorderColor: 'rgba(200, 200, 200, 1)',
data: value.map(function(x) {return x * 1;})
}
]
};
var ctx = $("#myChart");
var barGraph = new Chart(ctx, {
type: 'bar',
data: chartdata
});
},
error: function(data) {
console.log(data);
}
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
我试图实现我在其他主题中找到的解决方案，但仍然没有成功。任何帮助都将不胜感激！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55290321
复制相关文章
相似问题