javascript - 如何在 chart.js 或 D3 中制作阶梯线或阶梯图？

Question

我可以在 Google 电子表格中完成此操作，下面是屏幕截图:

这是 CSV 格式的小数据集

Buy PPU,Sell PPU,Net PPU
0.023,0.019,-0.000725
0.026,0.0165,-0.003725
0.021,0.021,0.00735
0.015,0.0165,0.0147
0.021,0.028,0.0168
0.018,0.028,0.0198

• jsFiddle 基本配置:http://jsfiddle.net/kaatula/j3FJf/1/
• Chart.js 文档:http://www.chartjs.org/docs/
• D3 文档:http://strongriley.github.io/d3/api/

感谢任何帮助。我在这两个库中都没有看到这种特定类型图表的示例(我相信称为“步进”或“步进线”)，但我相信它们足够灵活以实现此目的？

谢谢

Answer 1

似乎没有人回答过这个问题，但您可以通过在数据集配置中设置 steppedLine: true 使用 chart.js 来做到这一点。

var config = {
        type: 'line',
        data: {
            datasets: [{
                label: "My dataset",
                data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()],
                steppedLine: true,
            }
   }