问未显示Plotly.js跟踪
EN

Stack Overflow用户

提问于 2017-11-29 04:31:11

回答 1查看 505关注 0票数 1

我正在尝试使用Plotly.js创建一些历史加密货币价格的图表，但遇到了我的数据没有显示在创建的图表上的问题。我从https://plot.ly/javascript/ajax-call/上的示例代码构建我的代码，但将其用于我自己的数据源和plotly-latest.min.js的本地副本。我只使用了一小部分数据和一个跟踪来使代码正常工作，并且我在处理数据和创建跟踪之后放置了console.log语句，以根据示例代码及其数据集显示我的数据的格式是正确的。我已经将图表的范围设置为我的数据范围，但是当图表创建时，我仍然在图表上看不到任何东西，尽管在工作的示例代码之后对其进行了建模。我哪里错了？

我的代码：

<!DOCTYPE html>
<html>
<head>
<script src="plotly-latest.min.js"></script>
</head>
<body>
<div id="myDiv" style="width: 480px; height: 400px;"></div>
<script>
  function makePlot() {
    Plotly.d3.csv("bitcoin.csv", function(data){ processData(data) } );
  }

  function processData(allRows) {

    var Date = [], Open = [], High = [], Low = [], Volume = [], MarketCap = [];

    for (var i=0; i<allRows.length; i++) {
        row = allRows[i];
        tmpDate = row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[0]
        Date.unshift( tmpDate.split('/')[2] + '-' + tmpDate.split('/')[1] + '-' + tmpDate.split('/')[0]);
        Open.unshift( row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[1]);
        High.unshift( row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[2]);
        Low.unshift( row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[3]);
        Volume.unshift( row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[4]);
        MarketCap.unshift( row['Date;Open;High;Low;Close;Volume;MarketCap'].split(';')[5]);
    };
    makePlotly(Date, Open);
    }

    function makePlotly(Date, Open) {
        var plotDiv = document.getElementById("plot");
        var traces = [{
            Date: Date,
            Open: Open}
        ];
        console.log(traces);

        var layout = {
        xaxis: {
            type: 'date',
            title: 'Date',
            range: ['2017-11-12', '2017-11-22']
        },
        yaxis: {
            title: 'Price (USD)',
            range: [4000, 10000]
        },
        title: 'Cryptocurrency Historical Prices'
        }
        Plotly.newPlot('myDiv', traces, layout);
    }


  makePlot();
</script>

</body>
</html>

bitcoin.csv (1列)

Date;Open;High;Low;Close;Volume;MarketCap
22/11/2017;8077.95;8302.26;8075.47;8253.55;3633530000;134851000000
21/11/2017;8205.74;8348.66;7762.71;8071.26;4277610000;136967000000
20/11/2017;8039.07;8336.86;7949.36;8200.64;3488450000;134167000000
19/11/2017;7766.03;8101.91;7694.10;8036.49;3149320000;129595000000
18/11/2017;7697.21;7884.99;7463.44;7790.15;3667190000;128425000000
17/11/2017;7853.57;8004.59;7561.09;7708.99;4651670000;131026000000
16/11/2017;7323.24;7967.38;7176.58;7871.69;5123810000;122164000000
15/11/2017;6634.76;7342.25;6634.76;7315.54;4200880000;110667000000
14/11/2017;6561.48;6764.98;6461.75;6635.75;3197110000;109434000000
13/11/2017;5938.25;6811.19;5844.29;6559.49;6263250000;99029000000
12/11/2017;6295.45;6625.05;5519.01;5950.07;8957350000;104980000000

javascript

plot

回答 1

Stack Overflow用户

发布于 2018-11-19 18:21:03

我猜应该是您的变量跟踪导致了这个问题

var traces = [{
    x: Date, //not Date: Date
    y: Open  //not Open: Open
}];

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47540421

复制

相似问题

问未显示Plotly.js跟踪
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问未显示Plotly.js跟踪EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问未显示Plotly.js跟踪
EN