DOM
：：PointerEvent インターフェイス
編集：2022.09.22 by T.A.
→、
このインターフェイスは、接触点のジオメトリ、イベントを生成したデバイスタイプ、接触面に加えられた圧力の量など、ポインターによって生成された DOM イベントの状態を表します。
ポインタは、入力デバイス（マウス、ペン、またはタッチ対応面上の接触点など）のハードウェアにとらわれない表現です。ポインタは、画面などの接触面上の特定の座標（または座標のセット）をターゲットにすることができます。
ポインターのヒット テストは、ブラウザーがポインター イベントのターゲット要素を決定するために使用するプロセスです。 通常、これはポインターの位置と、画面媒体上のドキュメント内の要素の視覚的なレイアウトを考慮して決定します。
コンストラクター
- new PointerEvent()
- 信頼できない合成 PointerEvent を作成します。
プロパティ
このインターフェイスは、MouseEvent および Event からプロパティを継承します。
- PointerEvent.pointerId 読取専用 ●
- イベントの原因となっているポインターの一意の識別子。
- PointerEvent.width 読取専用 ●
- ポインターの接触ジオメトリの幅（X 軸の大きさ、CSS ピクセル単位）。
- PointerEvent.height 読取専用 ●
- ポインターの接触ジオメトリの高さ（Y 軸上の大きさ、CSS ピクセル単位）。
- PointerEvent.pressure 読取専用 ●
- 0 から 1 の範囲のポインター入力の正規化された圧力。ここで、0 と 1 は、それぞれハードウェアが検出できる最小圧力と最大圧力を表します。
- PointerEvent.tangentialPressure 読取専用 ●
- ポインター入力の正規化された接線圧力（バレル圧力またはシリンダー応力（cylinder stress）とも呼ばれます）は -1 から 1 の範囲で、0 はコントロールの中立位置です。
- PointerEvent.tiltX 読取専用 ●
- Y‐Z 平面と、ポインター（ペン／スタイラスなど）軸と Y 軸の両方を含む平面との間の平面角度（度単位、-90 から 90 の範囲）。
- PointerEvent.tiltY 読取専用 ●
- X‐Z 平面と、ポインター（ペン／スタイラスなど）軸と X 軸の両方を含む平面との間の平面角度（度単位、-90 から 90 の範囲）。
- PointerEvent.twist 読取専用 ●
- ポインター（ペン／スタイラスなど）の長軸を中心とした時計回りの回転の度数（0 から 359の範囲の値）。
- PointerEvent.pointerType 読取専用 ●
- イベントの原因となったデバイス タイプ（マウス、ペン、タッチなど）を示します。
| ポインター装置の型 | pointerType 値 |
|---|
| マウス | "mouse"
|
|---|
| ペンスタイラス | "pen"
|
|---|
| タッチ接触 | "touch"
|
|---|
- PointerEvent.isPrimary 読取専用 ●
- ポインターがこのポインター タイプのプライマリ ポインターを表すかどうかを示します。
メソッド
- PointerEvent.getCoalescedEvents() 廃止 ●
- 送出された pointermove イベントに合体したすべての PointerEvent インスタンスのシーケンスを返します。
ポインター イベント タイプ
PointerEvent インターフェイスにはいくつかのイベント タイプがあります。どのイベントが発生したかを判断するには、イベントの type プロパティを調べます。
注： 多くの場合、ポインターとマウスの両方のイベントが送信されることに注意することが重要です（ポインター固有でないコードでもユーザーと対話できるようにするため）。ポインター イベントを使用する場合は、event.preventDefault() を呼び出してマウス イベントも送信されないようにする必要があります。
- pointerover
- このイベントは、ポインティング デバイスが要素のヒットテスト境界内に移動したときに発生します。
- pointerenter
- このイベントは、ポインティング デバイスが要素またはその子孫の1つのヒットテスト境界内に移動したときに発生します。 これには、ホバーをサポートしないデバイスからの pointerdown イベントの結果も含まれます（pointerdown を参照）。このイベント タイプは pointerover に似ていますが、バブリングしないという点で異なります。
- pointerdown
- このイベントは、ポインターがアクティブになると発生します。マウスの場合、ボタンが押されていない状態から少なくとも 1 つのボタンが押された状態に移行したときに発生します。タッチの場合、物理的な接触がデジタイザとなされたときに発生します。ペンの場合、スタイラスがデジタイザと物理的に接触したときに発生します。
- pointermove
- このイベントは、ポインターが座標を変更したときに発生します。
- pointerup
- このイベントは、ポインターがアクティブでなくなったときに発生します。
- pointercancel
- ブラウザーは、ポインターがイベントを生成できなくなったと判断した場合（例えば、関連するデバイスが無効になった場合）、このイベントを発生させます。
- pointerout
- このイベントは、次のようないくつかの理由で発生します。ポインティング デバイスが要素のヒット テスト境界外に移動した。ホバーをサポートしていないデバイスの pointerup イベントが発生した（pointerup を参照）。 pointercancel イベントの発生後（pointercancel を参照）。ペン／スタイラスがデジタイザで検出可能なホバー範囲を離脱したとき。
- pointerleave
- このイベントは、ポインティング デバイスが要素のヒット テスト境界外に移動したときに発生します。ペン デバイスの場合、このイベントは、スタイラスがデジタイザで検出可能なホバー範囲を離脱したときに発生します。
- gotpointercapture
- このイベントは、要素がポインター キャプチャを受け取ったときに発生します。
- lostpointercapture
- このイベントは、ポインターに対するポインター キャプチャが解放された後に発生します。
GlobalEventHandlers
- GlobalEventHandlers.onpointerover
- pointerover イベントのためのグローバル イベントハンドラー。
- GlobalEventHandlers.onpointerenter
- pointerenter イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointerdown
- pointerdown イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointermove
- pointermove イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointerup
- pointerup イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointercancel
- pointercancel イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointerout
- pointerout イベントのためのグローバル イベント ハンドラー。
- GlobalEventHandlers.onpointerleave
- pointerleave イベントのためのグローバル イベント ハンドラー。
- event¶.altitudeAngle→●
- transducer（例：ペンやスタイラス）の仰角 ― ラジアンで，範囲［0、π/2］に入るようにされた。0 は物理面（X‐Y 平面）に平行、π/2 は物理面に垂直なことを表す。ハードウェアやプラットフォームが［傾き／角度］を報告しないときの値は、π/2 になるものとする。
¶図を省く
- event¶.azimuthAngle→●
- transducer（例：ペンやスタイラス）の方位角 ― ラジアンで、範囲［0、π/2］に入るようにされた。値 0 は、transducer の頭頂が X‐Y 平面上で正な X 軸方向（真上から見て“3時”の方向）を指していることを表現し、そこから時計回りに増大する（π/2 なら“6時”、π なら“9時”3π/2 なら“12時”を指している）。transducer が物理面に垂直になったとき（altitudeAngle ＝ π/2）の値は、0 になるものとする。ハードウェアやプラットフォームが［傾き／角度］を報告しないときの値は、0 になるものとする。
¶図を省く
- event¶.getPredictedEvents()→●
- 予測されたイベント群を返す。
【メソッド手続きは、別の節に与えられる。】
- event¶.button→●
-
| button 値 | 装置のボタン状態 |
|---|
| -1 | 前回のイベントから、どのボタンも、どのタッチ／ペン接触も変化していない
|
|---|
| 0 | マウスの左ボタンが押されている／タッチ接触がある／ペン接触がある
|
|---|
| 1 | マウスの中央ボタンが押されている
|
|---|
| 2 | マウスの右ボタンが押されている／ペンのバレルボタンが押されている
|
|---|
| 3 | マウスの x1（back）ボタンが押されている
|
|---|
| 4 | マウスの x2（forward）ボタンが押されている
|
|---|
| 5 | ペンのイレーザボタンが押されている
|
|---|
注記： マウスドラッグの間、pointermove イベントにおける button 属性の値は、mousemove イベントから異なることになる。例えば、右ボタンを押しながらマウスを動かしている間、pointermove イベントの button 値は -1 になる一方で、mousemove イベントの button 値は 2 になる。
- event¶.buttons→●
- buttons 属性は、装置の個々のボタンの現在の状態をビット･マスクとして与える（MouseEvent におけるそれと同じだが、可能な値は拡げられている）。
| buttonsの値 | 装置の現在のボタン状態 |
|---|
| 0 | ［マウス／hover しているペン］は どのボタンも押されずに動いている
|
|---|
| 1 | マウスの左ボタンが押されている／タッチ接触がある／ペン接触がある
|
|---|
| 4 | マウスの中央ボタンが押されている
|
|---|
| 2 | ［マウスの右ボタン／ペンのバレルボタン］が押されている
|
|---|
| 8 | マウスの x1（back）ボタンが押されている
|
|---|
| 16 | マウスの x2（forward）ボタンが押されている
|
|---|
| 32 | ペンのイレーザボタンが押されている
|
|---|
テスト