相关疑难解决方法(0)

创建人工缩放变换事件

我在 D3 中有一个时间轴,带有高度修改的拖动/滚动平移/缩放。缩放回调使用d3.event.transform缩放行为生成的对象。

我需要添加一个使用我现有回调的程序化缩放。我已经尝试并尝试这样做而不这样做,但我还没有让它工作,重用现有结构会更容易和更快。

所以输入是一个新的域,即[new Date(1800,0), new Date(2000,0)],输出应该是一个新的d3.event.transform,它的行为与鼠标滚轮事件的输出完全一样。

一些示例现有代码:

this.xScale = d3.scaleTime()
  .domain(this.initialDateRange)
  .range([0, this.w]);

this.xScaleShadow = d3.scaleTime()
  .domain(this.xScale.domain())
  .range([0, this.w]);

this.zoomBehavior = d3.zoom()
  .extent([[0, 0], [this.w, this.h]])
  .on('zoom', this.zoomHandler.bind(this));

this.timelineSVG
  .call(zoomBehavior);

... 

function zoomHandler(transformEvent) {
  this.xScale.domain(transformEvent.rescaleX(this.xScaleShadow).domain());

  // update UI
  this.timeAxis.transformHandler(transformEvent);
  this.updateGraphics();
}
Run Code Online (Sandbox Code Playgroud)

示例目标:

function zoomTo(extents){
  var newTransform = ?????(extents);

  zoomHandler(newTransform);
}
Run Code Online (Sandbox Code Playgroud)

(请不要将此问题标记为重复,我的问题更具体,指的是更新的 d3 API)

javascript d3.js

5
推荐指数
1
解决办法
2754
查看次数

标签 统计

d3.js ×1

javascript ×1