图表JS错误:未捕获TypeError:无法读取未定义的属性“顶部”

时间:2019-12-02 15:15:08

标签: javascript jquery chart.js

这是我第一次使用JS,并且需要使用jQuery和Chart Js来绘制时间序列。但是我不断收到以下错误:

Uncaught TypeError: Cannot read property 'top' of undefined
    at callFllSamplesApi (plot.js:105)

代码块:

//Script included before body tag  (Chart.js 2.4, jQuery 3.4, local file plot.js with callFllSamplesApi() )

<body>
        <canvas id="line-chart" width="450" height="500"></canvas>
        <button id="btn1" onclick="callFllSamplesApi()">Generate FLL Graph</button>
 </body>

函数callFLLSamplesApi如下所示,并引发错误。

function callFllSamplesApi() {

    var request = new XMLHttpRequest()
    request.open('GET', 'http://193.142.33.4/api/samples', true)
    request.onload = function(){
        ... Parsing code         
    }
    request.send()
    var ctx = document.getElementById("line-chart");
    var myChart = new Chart(ctx, {  <- Line 105 which throws an error
        ... More code for plotting
            }
        }
    });
}

1 个答案:

答案 0 :(得分:0)

您在折线图元素上缺少getContext()

var ctx = document.getElementById("line-chart").getContext('2d');

https://www.chartjs.org/docs/latest/