diff options
Diffstat (limited to 'files/ja/web/api/xrinputsource')
4 files changed, 269 insertions, 47 deletions
diff --git a/files/ja/web/api/xrinputsource/handedness/index.html b/files/ja/web/api/xrinputsource/handedness/index.html index 55b2ef3fdb..4f9eb86d63 100644 --- a/files/ja/web/api/xrinputsource/handedness/index.html +++ b/files/ja/web/api/xrinputsource/handedness/index.html @@ -1,47 +1,59 @@ --- -title: XRInputSource.handedness +title: XRHandedness slug: Web/API/XRInputSource/handedness tags: - API - AR - - Controller + - Enum + - Enumerated Type - Handedness - - Input - - Property - - Read-only - Reference + - Type - VR - WebXR - - WebXR API - WebXR Device API - - XR - - XRInputSource + - XRHandedness - hand - left - right -translation_of: Web/API/XRInputSource/handedness +translation_of: Web/API/XRHandedness +original_slug: Web/API/XRHandedness --- -<p>{{APIRef("WebXR")}}{{securecontext_header}}</p> +<p>{{APIRef("WebXR")}}</p> -<p>{{domxref("XRInputSource")}} の <strong><code>handedness</code></strong> 読み取り専用プロパティは、WebXR 入力ソースがユーザーのどの手に関連付けられているか、またはまったく関連付けられていないかを示します。</p> +<p>WebXR の <strong><code>XRHandedness</code></strong> 列挙型は、使用している XR 入力デバイスに接続された特定の入力コントローラーを操作するために使用しているユーザーの手を識別する値を提供します。 <code>XRHandedness</code> は、{{domxref("XRInputSource")}} の {{domxref("XRInputSource.handedness", "handedness")}} プロパティの値として使用されます。</p> -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Values" name="Values">値</h2> -<pre class="syntaxbox notranslate">let <em>hand</em> = <em>xrInputSource</em>.handedness;</pre> +<dl> + <dt><code>none</code></dt> + <dd>入力コントローラーは、ユーザーのいずれの手にも関連付けられていません。</dd> + <dt><code>left</code></dt> + <dd>入力コントローラーは、ユーザーの左手に握られているか、着用されているか、取り付けられています。</dd> + <dt><code>right</code></dt> + <dd>入力コントローラーは、ユーザーの右手に握られているか、着用されているか、取り付けられています。</dd> +</dl> -<h3 id="Value" name="Value">値</h3> - -<p>入力コントローラーがユーザーの片方の手にあるかどうか、もしそうならどちらの手にあるかを示す {{domxref("DOMString")}}。 {{domxref("XRHandedness")}} 列挙型に由来する値は、次のいずれかです。</p> +<h2 id="Examples" name="Examples">例</h2> -<p>{{page("/ja/docs/Web/API/XRHandedness", "Values")}}</p> +<p><code>handedness</code> の重要な使用方法の1つは、コントローラーがどちらの手にあるかを判別して、仮想空間でその手（またはその手が制御しているデバイス）の表現を描画できるようにすることです。</p> -<h2 id="Usage_notes" name="Usage_notes">使用上の注意</h2> +<pre class="brush: js notranslate">function updateInputSources(session, frame, refSpace) { + for (let source of session.inputSources) { + if (source.gripSpace) { + let gripPose = frame.getPose(source.gripSpace, refSpace); -<p>入力ソースがユーザーの手に関連付けられたデバイスでない場合（握られているか、取り付けられているか、着用されているかに関係なく）、<code>handedness</code> の値は <code>none</code> です。 これは、例えば、ヘッドセットに組み込まれたコントロールや、頭や体に取り付けられた入力デバイスなど、ハンドヘルドではない入力ソースを示している場合があります。</p> + if (gripPose) { + myRenderHandObject(gripPose, inputSource.handedness); + } + } + } +} +</pre> -<h2 id="Examples" name="Examples">例</h2> +<p>この関数は、すべてのアニメーションフレーム（または必要な滑らかさの程度とパフォーマンスの制約に応じて定期的に）で呼ばれ、入力ソースのリストをスキャンして、<code>null</code> ではない {{domxref("XRInputSource.gripSpace", "gripSpace")}} を持つものを探します。 <code>gripSpace</code> が存在する場合、それは入力ソースが何らかのハンドヘルドデバイスであることを意味するため、可能であれば視覚的にレンダリングする必要があります。</p> -<p>{{page("/ja/docs/Web/API/XRHandedness", "Examples")}}</p> +<p><code>gripSpace</code> が <code>null</code> 以外の場合、この関数は、現在の参照空間に変換された <code>gripSpace</code> のポーズを取得します。 それが有効であると仮定すると、<code>myRenderHandObject()</code> と呼ばれる関数が、グリップのポーズと <code>handedness</code> の値を使用して呼び出されます。 これらの値が手元にあれば（しゃれは意図していません）、<code>myRenderHandObject()</code> は、正しい手のために配置および形成された適切なモデルを描画できます。</p> <h2 id="Specifications" name="Specifications">仕様</h2> @@ -53,7 +65,7 @@ translation_of: Web/API/XRInputSource/handedness <th scope="col">コメント</th> </tr> <tr> - <td>{{SpecName('WebXR','#dom-xrinputsource-handedness','XRInputSource.handedness')}}</td> + <td>{{SpecName('WebXR','#enumdef-xrhandedness','XRHandedness')}}</td> <td>{{Spec2('WebXR')}}</td> <td>初期定義</td> </tr> @@ -62,7 +74,7 @@ translation_of: Web/API/XRInputSource/handedness <h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("api.XRInputSource.handedness")}}</p> +<p>{{Compat("api.XRHandedness")}}</p> <h2 id="See_also" name="See_also">関連情報</h2> @@ -70,4 +82,5 @@ translation_of: Web/API/XRInputSource/handedness <li><a href="/ja/docs/Web/API/WebXR_Device_API">WebXR Device API</a></li> <li><a href="/ja/docs/Web/API/WebXR_Device_API/Inputs">入力と入力ソース</a></li> <li><a href="/ja/docs/Web/WebXR%20Device%20API/Gamepads">WebXR アプリケーションでのゲームパッドの使用</a></li> + <li>{{domxref("XREye")}}: ビューを表示する対象の目を示します</li> </ul> diff --git a/files/ja/web/api/xrinputsource/handedness/index.md b/files/ja/web/api/xrinputsource/handedness/index.md new file mode 100644 index 0000000000..31716b2ace --- /dev/null +++ b/files/ja/web/api/xrinputsource/handedness/index.md @@ -0,0 +1,84 @@ +--- +title: XRInputSource.handedness +slug: Web/API/XRInputSource/handedness +tags: + - API + - AR + - Controller + - Handedness + - Input + - Property + - Read-only + - Reference + - VR + - WebXR + - WebXR API + - WebXR Device API + - XR + - XRInputSource + - hand + - left + - right +browser-compat: api.XRInputSource.handedness +translation_of: Web/API/XRInputSource/handedness +--- +{{APIRef("WebXR Device API")}} + +{{domxref("XRInputSource")}} の読み取り専用プロパティ **`handedness`** は、WebXR 入力ソースがユーザーのどの手に関連付けられているか、またはまったく関連付けられていないかを示します。 + +## 構文 + +```js +xrInputSource.handedness; +``` + +### 値 + +文字列で、入力コントローラーがユーザーの手に握られているかどうか、もしそうならばどちらの手なのかを表します。値は次のうちの一つです。 + +- `none` + - : 入力コントローラーは、ユーザーのいずれの手にも関連付けられていません。 +- `left` + - : 入力コントローラーは、ユーザーの左手に握られているか、着用されているか、取り付けられています。 +- `right` + - : 入力コントローラーは、ユーザーの右手に握られているか、着用されているか、取り付けられています。 + +## 使用上の注意 + +入力ソースがユーザーの手に関連付けられた機器でない場合 (握られているか、取り付けられているか、着用されているかに関係なく)、`handedness` の値は `none` です。 これは、例えば、ヘッドセットに組み込まれたコントロールや、頭や体に取り付けられた入力機器など、ハンドヘルドではない入力ソースを示している場合があります。 + +## 例 + +`handedness` の重要な使用方法の 1 つは、コントローラーがどちらの手にあるかを判別して、仮想空間でその手 (またはその手が制御している機器) の表現を描画できるようにすることです。 + +```js +function updateInputSources(session, frame, refSpace) { + for (let source of session.inputSources) { + if (source.gripSpace) { + let gripPose = frame.getPose(source.gripSpace, refSpace); + + if (gripPose) { + myRenderHandObject(gripPose, inputSource.handedness); + } + } + } +} +``` + +この関数は、すべてのアニメーションフレームで (または必要な滑らかさの程度とパフォーマンスの制約に応じて定期的に) 呼び出され、入力ソースのリストをスキャンして、 {{domxref("XRInputSource.gripSpace", "gripSpace")}} が `null` ではないものを探します。 `gripSpace` が存在する場合、それは入力ソースが何らかのハンドヘルド機器であることを意味するため、可能であれば視覚的にレンダリングする必要があります。 + +`gripSpace` が `null` 以外の場合、この関数は、現在の参照空間に変換された `gripSpace` のポーズを取得します。 それが有効であると仮定すると、`myRenderHandObject()` と呼ばれる関数が、グリップのポーズと `handedness` の値を使用して呼び出されます。 これらの値が手元にあれば (しゃれは意図していません)、正しい手のために配置および形成された適切なモデルを描画できます。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebXR Device API](/ja/docs/Web/API/WebXR_Device_API) +- [入力と入力ソース](/ja/docs/Web/API/WebXR_Device_API/Inputs) +- [WebXR アプリケーションでのゲームパッドの使用](/ja/docs/Web/WebXR%20Device%20API/Gamepads) diff --git a/files/ja/web/api/xrinputsource/targetraymode/index.html b/files/ja/web/api/xrinputsource/targetraymode/index.html index 7a64b7a122..79ca557c89 100644 --- a/files/ja/web/api/xrinputsource/targetraymode/index.html +++ b/files/ja/web/api/xrinputsource/targetraymode/index.html @@ -1,47 +1,78 @@ --- -title: XRInputSource.targetRayMode +title: XRTargetRayMode slug: Web/API/XRInputSource/targetRayMode tags: + - 3D - API - AR - - Pointing - - Property - - Ray - - Read-only + - Enum + - Enumerated Type + - Input + - Reality - Reference + - Type - VR + - Virtual - WebXR - WebXR API - WebXR Device API - XR - - XRInputSource - - direction - - pointer + - XRTargetRayMode + - augmented + - source - target - - targetRayMode -translation_of: Web/API/XRInputSource/targetRayMode +translation_of: Web/API/XRTargetRayMode +original_slug: Web/API/XRTargetRayMode --- -<p>{{APIRef("WebXR")}}{{securecontext_header}}</p> +<p>{{APIRef("WebXR")}}</p> -<p>{{domxref("XRInputSource")}} の <strong><code>targetRayMode</code></strong> 読み取り専用プロパティは、入力ソースのターゲット光線を生成する方法と、それをユーザーに提示する方法を示します。</p> +<p><span class="seoSummary"><a href="/ja/docs/Web/API/WebXR_Device_API">WebXR Device API</a> の <strong><code>XRTargetRayMode</code></strong> 列挙型は、入力コントローラーのターゲティング光線を生成する方法を記述します。</span> ターゲティングは、視線追跡システムを使用してターゲットを見るか、ハンドコントローラー、グローブ、またはモーショントラッキングシステムを使用してターゲットを指すか、画面上で指やマウスを使用してターゲットをタップまたはクリックすることによって行うことができます。</p> -<h2 id="Syntax" name="Syntax">構文</h2> +<p>通常、<strong>ターゲット光線</strong>は、ターゲティングシステムのソースから、ユーザーが見ている方向または指している方向にターゲット光線に沿って描画されます。 光線の終点を示す方法と同様に、光線のスタイルは一般的にあなた次第です。 ターゲットとなる点またはオブジェクトは、図形を描画するか、ターゲットとなる表面またはオブジェクトを強調表示することによって示される場合があります。</p> -<pre class="syntaxbox notranslate">let <em>rayMode</em> = <em>xrInputSource</em>.targetRayMode;</pre> +<div style="width: 42em;"> +<figure style="background: #eee; padding: 0.5em; border: 1px solid #aaa; border-radius: 1em; max-width: 504px; padding: 1em; margin: 1em auto;"> +<figcaption><strong>ハンドコントローラーから放出されるターゲット光線。</strong></figcaption> +<img alt="ハンドコントローラーから放出されるターゲット光線を示すスクリーンショット" src="https://mdn.mozillademos.org/files/17089/example-target-ray.gif" style="width: 100%;"></figure> +</div> -<h3 id="Value" name="Value">値</h3> +<p>ターゲット光線は、単純な線（理想的には距離とともにフェードする）から、上のスクリーンショットに示されているサイエンスフィクションの「フェイザー」スタイルなどのアニメーション効果まで、何でもかまいません。</p> -<p>{{domxref("XRTargetRayMode")}} 列挙型から取得した {{domxref("DOMString")}}。 ターゲット光線を生成してユーザーに提示するときに使用する方法を示します。 可能な値は次のとおりです。</p> +<h2 id="Values" name="Values">値</h2> -<p>{{page("/ja/docs/Web/API/XRTargetRayMode", "Values")}}</p> +<dl> + <dt><code>gaze</code>（視線）</dt> + <dd>ユーザーは、ユーザーが見ている方向を検出する視線追跡システム（または<strong>視線入力</strong>）を使用しています。 ターゲット光線は、ビューアーの目を起点として描画され、ビューアーが見ている方向に追従します。</dd> + <dt><code>screen</code>（画面）</dt> + <dd>ターゲット光線の方向は、タッチスクリーン、マウス、またはその他の触覚入力デバイスをタップして示します。</dd> + <dt><code>tracked-pointer</code>（追跡ポインター）</dt> + <dd>ターゲティングは、ユーザーがターゲットの方向に向けるハンドヘルドデバイスまたはハンドトラッキングシステムを使用して行われます。 ターゲット光線は、手（または手の中のオブジェクト）からターゲット方向に伸びます。 方向はプラットフォーム固有のルールを使用して決定されますが、そのようなルールが存在しない場合は、ユーザーが人差し指を手からまっすぐに向けていると仮定して方向が選択されます。</dd> +</dl> -<h2 id="Usage_notes" name="Usage_notes">使用上の注意</h2> +<h2 id="Examples" name="Examples">例</h2> -<p>入力ソースの {{domxref("XRInputSource.targetRaySpace", "targetRaySpace")}} は、ターゲット光線の位置と向きを示し、光線をレンダリングする場所を決定するために使用できます。</p> +<p>このコードの断片は、フレームごとに1回呼び出される関数の一部を示しています。 <code>null</code> 以外の {{domxref("XRInputSource.targetRaySpace", "targetRaySpace")}} を持つ入力を探します。 このプロパティの値を持つ入力は、ターゲット光線をユーザーから外側に投影する入力を表します。</p> -<h2 id="Example" name="Example">例</h2> +<p>このような入力ごとに、この例では、{{domxref("XRInputSource.targetRayMode", "targetRayMode")}} が <code>tracked-pointer</code> である入力を探します。 これは、入力が実際には、視線入力デバイス、画面タップ、またはマウスクリックではなく、ターゲティングデバイスを表すことを目的としていることを示しています。 追跡ポインターの場合、関数 <code>myRenderTargetRayAsBeam()</code> が呼び出され、入力コントローラーの仮想位置から、それが指している方向に外側にビームをレンダリングします。</p> -<p>{{page("/ja/docs/Web/API/XRTargetRayMode", "Examples")}}</p> +<p>コードは、仮想空間でのユーザーの手の位置を表すコントローラーや任意のオブジェクトの描画、その他の入力関連のタスクなどを引き続き実行する必要があります。</p> + +<pre class="brush: js notranslate">function updateInputSources(session, frame, refSpace) { + for (let source of session.getInputSources()) { + let targetRayPose = frame.getPose(inputSource.targetRaySpace, refSpace); + + if (targetRayPose) { + if (source.targetRayMode == "tracked-pointer") { + myRenderTargetRayAsBeam(targetRayPose); + } + } + + /* ... */ + } +} +</pre> + +<p>詳細とより完全な例については、<a href="/ja/docs/Web/API/WebXR_Device_API/Inputs">入力と入力ソース</a>の記事を参照してください。</p> <h2 id="Specifications" name="Specifications">仕様</h2> @@ -53,7 +84,7 @@ translation_of: Web/API/XRInputSource/targetRayMode <th scope="col">コメント</th> </tr> <tr> - <td>{{SpecName('WebXR','#dom-xrinputsource-targetraymode','XRInputSource.handedness')}}</td> + <td>{{SpecName('WebXR','#enumdef-xrtargetraymode','XRTargetRayMode')}}</td> <td>{{Spec2('WebXR')}}</td> <td>初期定義</td> </tr> @@ -62,12 +93,11 @@ translation_of: Web/API/XRInputSource/targetRayMode <h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("api.XRInputSource.handedness")}}</p> +<p>{{Compat("api.XRTargetRayMode")}}</p> <h2 id="See_also" name="See_also">関連情報</h2> <ul> <li><a href="/ja/docs/Web/API/WebXR_Device_API">WebXR Device API</a></li> <li><a href="/ja/docs/Web/API/WebXR_Device_API/Inputs">入力と入力ソース</a></li> - <li><a href="/ja/docs/Web/WebXR%20Device%20API/Gamepads">WebXR アプリケーションでのゲームパッドの使用</a></li> </ul> diff --git a/files/ja/web/api/xrinputsource/targetraymode/index.md b/files/ja/web/api/xrinputsource/targetraymode/index.md new file mode 100644 index 0000000000..d21d4c82bd --- /dev/null +++ b/files/ja/web/api/xrinputsource/targetraymode/index.md @@ -0,0 +1,95 @@ +--- +title: XRInputSource.targetRayMode +slug: Web/API/XRInputSource/targetRayMode +tags: + - API + - AR + - Pointing + - Property + - Ray + - Read-only + - Reference + - VR + - WebXR + - WebXR API + - WebXR Device API + - XR + - XRInputSource + - direction + - pointer + - target + - targetRayMode +translation_of: Web/API/XRInputSource/targetRayMode +--- +{{APIRef("WebXR Device API")}} + +{{domxref("XRInputSource")}} の読み取り専用プロパティ **`targetRayMode`** は、入力ソースのターゲット光線を生成する方法と、それをユーザーに提示する方法を示します。 + +一般的には、ターゲティングシステムのソースから、ユーザーが見ている、または指している方向のターゲット光線に沿って、ターゲット光線が描かれます。光線のスタイルは一般的に自由で、光線の終点を示す方法も自由です。ターゲットとなるポイントやオブジェクトは、図形を描いたり、ターゲットとなる表面やオブジェクトをハイライトすることで示されるかもしれません。 + +ターゲット光線はハンドコントローラーが影響します。 + + + +ターゲット光線は、単純な線 (理想的には距離に応じて消えていく) から、上のスクリーンショットにあるような SF の「フェイザー」スタイルのようなアニメーション効果まで、さまざまなものがあります。 + +## 構文 + +```js +let rayMode = xrInputSource.targetRayMode; +``` + +### 値 + +ターゲット光線を生成してユーザーに提示する際に、どの方法を使用するかを示す文字列です。指定できる値は次の通りです。 + +- `gaze` (視線) + - : ユーザーは、ユーザーが見ている方向を検出する視線追跡システム (または**視線入力**) を使用しています。 ターゲット光線は、ビューアーの目を起点として描画され、ビューアーが見ている方向に追従します。 +- `screen` (画面) + - : ターゲット光線の方向は、タッチスクリーン、マウス、またはその他の触覚入力機器をタップして示します。 +- `tracked-pointer` (追跡ポインター) + - : ターゲティングは、ユーザーがターゲットの方向に向けるハンドヘルド機器またはハンドトラッキングシステムを使用して行われます。 ターゲット光線は、手 (または手の中のオブジェクト) からターゲット方向に伸びます。方向はプラットフォーム固有のルールを使用して決定されますが、そのようなルールが存在しない場合は、ユーザーが人差し指を手からまっすぐに向けていると仮定して方向が選択されます。 + +## 使用上の注意 + +入力ソースの {{domxref("XRInputSource.targetRaySpace", "targetRaySpace")}} は、ターゲット光線の位置と向きを示し、光線をレンダリングする場所を決定するために使用できます。 + +## 例 + +このコードの断片は、フレームごとに 1 回呼び出される関数の一部を示しています。 `null` 以外の {{domxref("XRInputSource.targetRaySpace", "targetRaySpace")}} を持つ入力を探します。 このプロパティの値を持つ入力は、ターゲット光線をユーザーから外側に投影する入力を表します。 + +このような入力ごとに、この例では、 {{domxref("XRInputSource.targetRayMode", "targetRayMode")}} が `tracked-pointer` である入力を探します。 これは、入力が実際には、視線入力機器、画面タップ、またはマウスクリックではなく、ターゲティング機器を表すことを目的としていることを示しています。 追跡ポインターの場合、関数 `myRenderTargetRayAsBeam()` が呼び出され、入力コントローラーの仮想位置から、それが指している方向に外側にビームをレンダリングします。 + +コードは、仮想空間でのユーザーの手の位置を表すコントローラーや任意のオブジェクトの描画、その他の入力関連のタスクなどを引き続き実行する必要があります。 + +```js +function updateInputSources(session, frame, refSpace) { + for (let source of session.getInputSources()) { + let targetRayPose = frame.getPose(inputSource.targetRaySpace, refSpace); + + if (targetRayPose) { + if (source.targetRayMode == "tracked-pointer") { + myRenderTargetRayAsBeam(targetRayPose); + } + } + + /* ... */ + } +} +``` + +詳細とより完全な例については、[入力と入力ソース](/ja/docs/Web/API/WebXR_Device_API/Inputs)の記事を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebXR Device API](/ja/docs/Web/API/WebXR_Device_API) +- [入力と入力ソース](/ja/docs/Web/API/WebXR_Device_API/Inputs) +- [WebXR アプリケーションでのゲームパッドの使用](/ja/docs/Web/WebXR%20Device%20API/Gamepads) |