如何在two.js中捕获形状或组上的点击事件？

Question

我使用two.js 绘制了一个形状，我想编写代码来处理该形状上的单击事件。不是画布，而是形状本身。

front_left.domElement = $('#two-' + front_left.id)
    .css('cursor', 'pointer')
    .click(function(e){
        alert("Hello World!");
    });

该代码取自似乎应该有效的答案：

circle.domElement = $('#two-' + circle.id)
  .css('cursor', 'pointer')
  .click(function(e) {
    circle.fill = getNonMainRandomColor(getRandomColor());
  });

但它对我使用最新的 JQuery 和最新的 Two.js 不起作用，而且在示例中似乎也不起作用，因为代码读起来好像单击圆圈应该使颜色发生变化，但是我尝试过的任何浏览器或计算机上都没有任何反应。

那么，如何捕获并响应使用two.js绘制的形状/组的点击事件呢？

Answer 1

感谢你的信息。这个答案不再有效的原因是，从那时起，two.js 已经发生了变化。我在这里添加了一个例子。其要点是：

1. 使用svg渲染器
2. 每当你创建一个形状时，它都会有一个私有属性_renderer
3. 可以访问elem它对应的dom元素
4. 但！在访问渲染器之前确保渲染器已更新

例如：

var shape = two.makeCircle(two.width / 2, two.height / 2, 50);
two.update();
shape._renderer.elem.addEventListener('click', handler, false);

而且，如果您喜欢冒险，您可以像本示例中那样混合渲染器。