首页 > 解决方案 > 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 
}, {
},{ 
},..]

标签: javascriptjqueryajaxflaskamazon-ec2

解决方案


推荐阅读