Context.isPointInPath用法

Question

我用Google搜索但没有找到任何Context.isPointInPath在HTML 5 中使用的示例.

我知道如果关键点在当前路径上,它应该返回true,但你究竟如何使用它？如果你使用它之间context.beginPath()和cotext.closePath()(或填充*为此事)

我试过这个:

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.fillRect(0,0, 100,100);
ctx.isPointInPath(50,50); // Returned false
ctx.isPointInPath(50,0);  // Tried it on the actual path, not the filled region, returned false
ctx.isPointInPath(50,8);  // My canvas had the default 8 offset, returned false
ctx.isPointInPath(50,9);  // Canvas had a border of 1px, returned false

我不知道出了什么问题,但他们都返回了假,我从来没有一个回归真实.

最后,我关闭了路径并检查了值,仍然返回false.

Answer 1

所有调用isPointInPath()都返回false,因为在处理上下文时实际上并没有创建任何路径.该fillRect()函数不会创建路径.它只是用你之前指定的颜色填充画布上的一些像素.

相反,您将需要使用其中一个路径修改函数,例如rect()或moveTo().有关所有细节isPointInPath()和路径功能,请参阅此处的画布规格:

isPointInPath():http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-ispointinpath

路径功能:http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#complex-shapes-%28paths%29