在KineticJS定制drawfunc(Custom drawfunc in KineticJS)

我已经经历了几篇文章，走了检测命中率只有在圆形或长方形的周长。 实施它的一些解决方法是通过在形状的Click事件做数学或创建组来完成。 没关系。 但是，有没有我们可以通过创建一个只绘制一个矩形的周长，圆（只中风）的自定义绘制函数实现这个任何方式。

任何帮助将非常感激。

Answer 1:

如果你设置你的命中功能这是非常简单的。 这里有一个的jsfiddle：

http://jsfiddle.net/L3EST/

关键是要使用strokeShape（）方法中的自定义功能命中，而不是fillStrokeShape（），这是默认打功能使用。

  var rect = new Kinetic.Rect({
    x: 10,
    y: 10,
    width: 100,
    height: 50,
    fill: 'red',
    stroke: 'black',
    strokeWidth: 10,
    drawHitFunc: function(context) {
      context.beginPath();
      context.rect(0, 0, this.getWidth(), this.getHeight());
      context.closePath();
      context.strokeShape(this);
    }
  });

附加事件在的jsfiddle完成后，当你将鼠标放置或形状的周长的鼠标移开后，事件被触发。

文章来源: Custom drawfunc in KineticJS