我是 D3 的新手,想实现类似于此处显示的单击-拖动-缩放:http://www.highcharts.com/demo/line-time-series
我已经构建了一个折线图,但对如何实现它感到困惑。
我想我需要一些 JS 事件处理程序来找到我的 mousedown 和 mouseup 发生的位置。但是,如何创建用户拖动时图形上出现的阴影?
最佳答案
在 d3.js
中,您可能需要使用 brush
来完成此操作。您可以在 http://bl.ocks.org/1962173 查看我放在一起的示例它做类似的事情。
相关代码为:
var brush = d3.svg.brush()
.x(x)
.extent([d3.time.monday(now),d3.time.saturday.ceil(now)])
.on("brush", display);
其中display
是一个根据brush
当前范围重绘数据的函数。这样你就不需要尝试 Hook 你自己的处理程序,甚至根本不需要担心调整突出显示区域的大小。
关于javascript - 如何使用鼠标单击并拖动来放大D3,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11302768/