.attr not defined d3js

我有一个svg，我希望缩放和平移。我跟着这个例子：http://bl.ocks.org/sgruhier/1d692762f8328a2c9957使用d3.js V3.attr not defined d3js

我在打字稿实施这一如下：

  this._svg = d3.select('body') 
       .append('svg') 
       .attr('style', 'max-width: 100%') 
       .attr('viewBox', this._viewbox_x + ' ' + this._viewbox_y + ' ' + this.responsemodel.width + ' ' + this.responsemodel.height) 
       .call(d3.behavior.zoom().on('zoom', this.zoom)) 
       .append('g')

和我的变焦功能

zoom() { 
    this._svg.attr('transform', 'translate(' + (<d3.ZoomEvent>d3.event).translate + ')scale(' + (<d3.ZoomEvent>d3.event).scale + ')'); 
}

在运行过程中出现这个，I'm告诉“无法读取属性”attr'未定义的“，这来自_svg未定义的事实。

有人能向我解释这是为什么，以及如何解决呢？

在此先感谢

来源

2016-09-17 methgaard

把完整的代码在小提琴的任何机会呢？ https://jsfiddle.net/ –

是的。 https://jsfiddle.net/a1L0jLj3/ 但问题不在这里出现 – methgaard

您需要将所有的TypeScript放在小提琴中。您可以通过选择当前显示为'JavaScript'的设置cog并将其更改为TypeScript来更改代码输入文件的语言 –

我想这是因为你的事件回调的this指window对象。

你尝试绑定您的this表示图表的事件功能：

this._svg = d3.select('body') 
     .append('svg') 
     .attr('style', 'max-width: 100%') 
     .attr('viewBox', this._viewbox_x + ' ' + this._viewbox_y + ' ' + this.responsemodel.width + ' ' + this.responsemodel.height) 
     .call(d3.behavior.zoom().on('zoom', this.zoom.bind(this))) 
     .append('g')

来源

2016-09-19 13:22:18

太棒了！这就是诀窍！谢谢！ – methgaard

.attr not defined d3js

回答

相关问题