d3事件未触发

Question

我正在使用D3的弧形并附加了D3 drag处理程序来捕捉拖动。查看浏览器的调试器：

您可以看到生成的Arc的路径确实正在侦听相应的事件，但回调永远不会被触发，并且没有向控制台报告JS错误。

用于添加处理程序（以及回调）的代码在这里。对于那些熟悉Ember的人来说，很棒，对于你们这些人我并没有尝试只展示相关的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日）的最新版本

对于其他上下文，负责绘制路径的Handlebars模板也是如此：

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

这里没有什么值得注意的，只是要指出模板不会调用任何本机DOM事件，并且在DOM中可以使用“未选择”的类名来让d3选择器找到它（它似乎有完成;因此DOM事件侦听器显示在调试器中。）

我添加了问题的在线演示：demo。拖动事件附加到弧，类名为“未选中”。您应该可以从该形状拖动并触发回调。

Answer 1

是否存在包含pointer-events: none的应用css样式的可能性？

如果你看看这个jsfiddle示例，你会看到你不能拖动应用了类undraggable的圆圈，但它不会影响chrome检查员说元素正在监听的事件

.undraggable {
   pointer-events: none;
}

http://jsfiddle.net/2y2yqy55/1/