我有一个十字准线图表,你可以在这里找到:
https://bl.ocks.org/diggetybo/4b8ede8e1b45ce1abf55f981a261a8d1
我很抱歉它不适合该块。用于解释如何纠正的加分点!
点击全屏视图(或缩小一点)后,您将看到真正的问题。十字准线不跟随鼠标移动。代码不是超级高效,我只是将2个图形拼接在一起frankenstein风格(嘿它的万圣节很快)所以这就是为什么这么长的线条。即使我的X轴和Y轴都是线性刻度,我保留了模板的标签,这是一个时间维x轴,因此d.date。
我确实设法在上述链接中获得了你所看到的index.html,大约有四个时间。但是,这一次,它没有用。鼠标移动失败,结果十字准线卡在一个地方。我的猜测是它与解析数据的方式有关?因为这个数据集似乎特别错误,但我以前错了。请留下你的预感。我没有想法。
我要添加的最后一件事是开发工具给了我一个错误,说明关于mousemove函数的'无法读取未定义'的属性'date'。
function mousemove() {
var x0 = x.invert(d3.mouse(this)[0]),
i = bisectDate(data, x0, 1),
d0 = data[i - 1],
d1 = data[i],
d = x0 - d0.date > d1.date - x0 ? d1 : d0;
我不确定这实际上是真正的罪魁祸首,我之前有过这个错误,图表工作正常。我以为我会安全地玩并分享错误,万一它会有所帮助。