Question

我正在尝试构建一个动态图表，使用CanvasJS每秒更新此API数据：http://www.coincap.io/history/1day/BTC

我无法显示正确的值。现在它只显示X轴上的第一个数据集（MktCap）。我需要第二组（Price）的数据。我弄乱了钥匙吗？

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
window.onload = function() {
    var dataPoints = [];
    var chart;
    $.getJSON("http://www.coincap.io/history/1day/BTC", function(data) {  
        $.each(data, function(key, value){
            dataPoints.push({x: value[1][0], y: parseInt(value[1][1])});
        });
        chart = new CanvasJS.Chart("chartContainer",{
            title:{
                text:"Live Chart with dataPoints from External JSON"
            },
            data: [{
                type: "line",
                dataPoints : dataPoints,
            }]
        });
        chart.render();
        updateChart();
    });
    function updateChart() {
    $.getJSON("http://www.coincap.io/history/1day/BTC", function(data) {
        $.each(data, function(key, value) {
            dataPoints.push({
            x: parseInt(value[1][0]),
            y: parseInt(value[1][1])
            });
        });
        chart.render();
        setTimeout(function(){updateChart()}, 1000);
    });
    }
}
</script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>

Answer 1

问题出在0xFFFFFFFF，因为$.each(data, ...是一个对象，具有以下形状：

data

在对象上调用{ "market_cap": [[0, 1], [1, 2], [2, 1], ...], "price": [[0, 21], [1, 42], [2, 11], ...], "volume": [[0, 10], [1, 3], [2, 2], ...], }时，它会迭代对象的键。使用您的代码，它只获得数组的两个项目。你想要做的是选择$.each，所以它将遍历所有项目。例如：

"price"

初始和$.each(data.price, function(key, value) { dataPoints.push({ x: value[0], y: value[1], }) })函数。请注意，您不需要使用updateChart，因为它已经是整数。之后，您将看到正确的行。

使用Javascript

1 个答案: