構文

context . isPointInPath(x, y)

指定の地点が現在のパスの中にあるなら true を返します。

仕様

原文：http://www.w3.org/TR/2010/WD-2dcontext-20100624/#dom-context-2d-ispointinpath

サンプル

isPointInPath() メソッドは、分かりやすく言えば、引数に与えた座標が、現在サブパスにセットされている図形の中に入っているか、それともその図形の外にあるのかを評価します。

このサンプルでは、まず 座標 (20, 30) を左上端とした、横幅 60 ピクセル、縦幅 40 ピクセルの矩形を描きます。そして、座標 (50, 50) と 座標 (10, 10) が、その矩形の中にあるのか外にあるのかを isPointInPath() メソッドを使って評価します。上の図は、矩形と評価対象となる座標を示したものです。緑色の点は座標 (50, 50) を、赤色の点は 座標 (10, 10) を表しています。

/* 矩形を描く */
ctx.rect(20, 30, 60, 40);
/* 画面描画 */
ctx.fill();
/* 座標 (50, 50) は true になる */
alert( "(50, 50) : " + ctx.isPointInPath(50, 50) );
/* 座標 (10, 10) は false になる */
alert( "(10, 10) : " + ctx.isPointInPath(10, 10) );

[isPointInPath() メソッドの実際のサンプル]

このサンプルでは、パスで描いた図形が矩形のため、座標の位置がパスの中なのか外なのかは一目瞭然ですが、円弧や二次曲線やベジェ曲線で描かれたパスに対して評価したい場合には、このメソッドが役に立ちます。

ブラウザ対応状況