Question

我试图构建一个图形系统，其中一个范围内的线图是虚线，超出或未达到该范围的线图是用实线绘制的。也就是说，在以下数组[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]中，如果我的范围是[4,7]，我会有两组积分：我的数据在范围内（虚线）：[null, null, null, 4, 5, 6, 7, null, null, null];和我的数据超出范围（实线）[1, 2, 3, null, null, null, null, 8, 9, 10]。

我想我会通过为每个数据集重新绘制两个线图来做到这一点。一个带有虚线样式，另一个带有坚固的风格。为了达到这个目的，我尝试了一个POC来创建我的线图中的空白。

我想我可以通过删除数据系列中的元素然后再发送它来呈现（http://jsfiddle.net/drewsonne/tczooff2/）：

var random = new Rickshaw.Fixtures.RandomData(150);

for (var i = 0; i < 150; i++) {
    random.addData(seriesData);
}

// Create empty part of graph
for (var i = 70; i < 100; i++) {
    delete seriesData[0][i];
}

但我似乎在我的图表中得到一条直线插值线，其中删除的元素是。

是否可以在RickshawJS中渲染局部线，或者是否可以实现我的范围样式的任何其他方法？

我很欣赏我甚至可能不得不把这些情节打破成连续的线条。对于我上面的例子，这需要3个不同的图。如果我这样做，我仍然需要绘制局部情节。 rickshawjs中的数据集中的任何空元素都会出错。

编辑：解决方法是更改我的上述代码以删除“＆＃39; y＆＃39;只保留价值，同时保留＆＃39; x＆＃39;值：

// Create empty part of graph
for (var j = 10; j < 100; j++) {
    seriesData[0][j].y = null;
}

RickshawJS中带有范围的样式线图

0 个答案: