我正在制作一个时间序列折线图,让用户从当前滚动回来.我可以在实时d3.js图表上找到教程,我可以找到关于缩放和平移的教程,我可以找到有关使用外部数据源的教程.我无法将所有这些知识融合在一起.
这是我正在寻找的行为:
- 图表可以及时向后平移(意味着线条,数据点和轴随着鼠标或手指的拖动而移动)
- 平移应仅影响x轴,不应进行缩放.
- 当用户平移图表时,会加载更多数据,从而提供无限滚动体验
- 我打算在至少一个额外的"页面"缓冲数据中为用户滚动进入(已经找到了这部分)
- 我认为我不需要转换,因为图表的平移已经可以顺利地转换它
这是我到目前为止所做的工作:
// set up a zoom handler only for panning
// by limiting the scaleExtent
var zoom = d3.behavior.zoom()
.x(x)
.y(y)
.scaleExtent([1, 1])
.on("zoom", pan);
var loadedPage = 1; // begin with one page of data loaded
var nextPage = 2; // next page will be page 2
var panX = 0;
function pan()
{
if (d3.event)
{
panX = d3.event ? d3.event.translate[0] : 0;
// is there a better way to determine …Run Code Online (Sandbox Code Playgroud)