1

目前我有这个：

<div id="chartContainer">
    <script src="http://d3js.org/d3.v3.min.js"></script>
    <script src="http://dimplejs.org/dist/dimple.v1.min.js"></script>
    <script type="text/javascript">
    var svg = dimple.newSvg("#chartContainer", 590, 400);
    var data = [
        {'Date': '01-03-2013', 'Views': '13'},
        {'Date': '05-03-2013', 'Views': '123'},
        {'Date': '09-03-2013', 'Views': '234'},
        {'Date': '13-03-2013', 'Views': '95'},
    ];
    /*
    var data = [
        {'Date': '01-03-2013 - 02-03-2013', 'Views': '13'},
        {'Date': '05-03-2013 - 06-03-2013', 'Views': '123'},
        {'Date': '09-03-2013 - 10-03-2013', 'Views': '234'},
        {'Date': '13-03-2013 - 14-03-2013', 'Views': '95'},
    ]; */
    var myChart = new dimple.chart(svg, data);
    myChart.setBounds(70, 30, 490, 310)
    var x = myChart.addTimeAxis("x", "Date", "%d-%m-%Y", "%d-%m");
    x.showGridlines = true;
    x.addOrderRule("Date");
    var y = myChart.addMeasureAxis("y", "Views");
    y.tickFormat = "d";
    var s = myChart.addSeries(null, dimple.plot.line);
    s.lineWeight = 4;
    s.lineMarkers = true;
    myChart.draw();
    </script>
</div>

演示：jsfiddle

我应该怎么做才能让 dimple.js/d3.js 与范围日期的注释数据一起正常工作？

4

1 回答 1

1

这不是一个专门的酒窝问题，酒窝只是使用 d3 时间格式，而后者又是 python 格式。我不确定如何填充未知字符。一种方法是使用一些简单的 JS 预先修剪字符串。如果您需要保持数据原样，您可以通过将第二个日期分配为毫秒来作弊：

“%d-%m-%Y - %L-%L-%L%L”

这基本上会为每个日期增加 13 毫秒，这在显示中并不重要，但这并不是一个真正好的解决方案。

于 2013-08-13T08:52:33.173 回答