CanvasRenderingContext2D.isPointInPath()

Die Methode CanvasRenderingContext2D.isPointInPath() der Canvas 2D API entscheidet darüber, ob ein Punkt in einem gegeben Pfad enthalten ist.

Syntax

boolean ctx.isPointInPath(x, y);
boolean ctx.isPointInPath(x, y, fillRule);

boolean ctx.isPointInPath(path, x, y);
boolean ctx.isPointInPath(path, x, y, fillRule);

Parameter

x
Die X-Koordinate des zu prüfenden Punktes.
y
Die Y-Koordinate des zu prüfenden Punktes.
fillRule
Der Algorithmus, der prüft, ob der Punkt innerhalb oder außerhalb des Pfades liegt.
Mögliche Werte:
path
Ein Path2D (en-US) Objekt.

Rückgabewert

Boolean
Ein Boolean, welcher true ist, wenn der gegebene Punkt innerhalb des gegeben Pfades liegt, ansonsten false.

Beispiele

Benutzung der Methode isPointInPath

Dies ist ein einfaches Snippet, welches die isPointinPath Methode nutzt, um zu prüfen, ob ein Punkt in gegebenem Pfad enthalten ist.

HTML

<canvas id="canvas"></canvas>

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

ctx.rect(10, 10, 100, 100);
ctx.stroke();
console.log(ctx.isPointInPath(10, 10)); // true

Editieren Sie den folgenden Quelltext. Die Änderungen werden in Echtzeit übernommen und Log-Ausgaben in die console ausgegeben:

Specifications

Browser compatibility

BCD tables only load in the browser

Compatibility notes

  • Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4), this method incorrectly failed to multiply the specified point's coordinates by the current transformation matrix before comparing it to the path. Now this method works correctly even if the context is rotated, scaled, or otherwise transformed.

See also