javascript - Canvas JS 不填充图表
问题描述
我有 jQuery 代码,它使用来自 RESTful Web 服务的 JSON 响应来绘制图表。我正在使用 Canvas JS 来完成这项任务。每当我运行程序时,我都会得到一个空图。任何和所有的帮助表示赞赏。
$(document).ready(function() {
$('form').on('submit', function(event) {
var date = $('#nameInput').val();
var datatmax = [];
var datatmin = [];
$.ajax({
data: {
v: $('#nameInput').val(),
},
type: 'GET',
url: '/forecast/' + date
}).done(function(data) {
if (data) {
$.each(data, function(d) {
datatmax.push({
y: d.TMAX,
label = d.DATE
})
datatmin.push({
y: d.TMIN,
label = d.DATE
})
})
var chart = new CanvasJS.Chart("chartContainer", {
title: {
text: "WEATHER FORECAST"
},
data: [{
type: "line",
markerType: "circle",
name: "TMAX",
showInLegend: true,
dataPoints: datatmax
}, {
type: "line",
name: "TMIN",
lineDashType: "dash",
showInLegend: true,
markerType: "square",
dataPoints: datatmin
}]
});
chart.render();
}
});
event.preventDefault();
});
});
JSON数组的格式为
[{
'DATE': VAL,
'TMAX': VAL,
'TMIN': VAL
}, {
},{
},..]
解决方案
推荐阅读
- javascript - JavaScript Accordion in a different element
- apache-kafka - Kafka Streams Materialization 是如何工作的?
- c# - 当 Razor 页面 DropDownListFor 在没有 JavaScript 的情况下更改时,我如何更新条目
- flutter - 从 TextField 中的共享首选项加载初始文本
- machine-learning - ValueError:Eager 模式下仅支持 TF 原生优化器
- serial-port - C# WinForms。处理从串口接收到的十六进制数据。我做对了吗?
- c++ - C++ 入门 5 版。重载函数和用户定义的转换
- javascript - 通过for循环逐字过滤字符串
- matlab - matlab mcc编译的独立可执行文件:无法识别的函数或变量
- bootstrap-4 - 禁用字段集中的引导选项卡不适用于 Firefox