Javascript d3事件未触发

我使用的是D3的弧形，并附加了D3

drag

处理程序来捕捉拖动运动。查看浏览器的调试器：

您可以看到，生成的Arc的路径确实在侦听适当的事件，但是回调从未触发，也没有向控制台报告JS错误

用于添加处理程序（以及回调）的代码如下所示。对于那些熟悉余烬的人，太好了，对于那些不熟悉余烬的人，我尝试只展示相关的JS部分

import { drag } from 'd3-drag';
import { arc } from 'd3-shape';
import { select } from 'd3-selection';

const uiArc = Ember.Component.extend({
  layout,
  tagName: '',
  init() {
    this._super(...arguments);
    Ember.run.schedule('afterRender', () => {
      this.svg = document.getElementById(this.elementId);
      this.addDragListeners(`#${this.elementId} .unselected`);
    });
  },

  addDragListeners(target) {
    drag.container = this;
    select(target).call(drag().on('start', this._dragStart));
    select(target).call(drag().on('drag', this._dragging));
    select(target).call(drag().on('end', this._dragEnd));
  },

  _dragStart(e) {
    console.log('drag starting', e);
  },
  _dragging(e) {
    console.log('dragging', e);
  },
  _dragEnd(e) {
    console.log('drag ending', e);
  },

有人能帮我找出如何调试这个或建议什么可能是错误的吗

注：我使用的是d3版本4，最新版本（2016年5月30日）

---

对于其他上下文，以下是负责绘制路径的把手模板：

<path
  d={{arc}}
  class='unselected'
  style="stroke: {{unselectedColor}}; fill: {{unselectedColor}};"
></path>

这里没有什么值得注意的，只是指出模板不调用任何本机DOM事件，并且DOM中的类名“unselected”可供d3选择器查找（它似乎已经这样做了；因此DOM事件侦听器显示在调试器中）

---

---

我已经添加了问题的在线演示：。拖动事件附加到类名为“未选定”的弧。您应该能够从该形状拖动并启动回调。

不可能存在包含

指针事件的应用css样式：none

如果您查看这个JSFIDLE示例，您将看到您不能在应用了UNDRAGABLE类的情况下拖动圆圈，但是它不会影响chrome inspector所说的元素正在侦听的事件

.undraggable {
   pointer-events: none;
}

---

没有，但建议不错。我确实添加了

指针事件：无到一些邻近/重叠的DOM元素，以确保它们不会干扰。可能会对其产生影响的是，您将标记名设置为“”，这会阻止Ember插入DOM节点，从而阻止任何类型的事件处理。此外，此行
this.svg=document.getElementById（this.elementId）didInsertElement
select（this.element）.call（drag（）.on（'start'，（event）=>console.log（event）），则code>可以写为
this.element
这样行吗？在大多数情况下，我更喜欢无标记组件，但有时这种方法有缺点。今天晚些时候我会试试你的建议。谢谢。：）p、 s.this.svg=document.getElementById（this.elementId）行当前未被使用，但它确实有效。我假设您在提出此建议时引用了标记的组件？