センサー データと表示の向き (HTML)

[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]

AccelerometerGyrometerCompassInclinometer、および OrientationSensor の各クラスのセンサー データは、基準軸によって定義されます。 これらの軸はデバイスの横長の向きで定義され、ユーザーがデバイスの向きを変えると、デバイスと共に回転します。 アプリが自動回転をサポートしている場合、つまり、ユーザーがデバイスを回転させたときに連動して向きが変わる場合、センサー データを使う前に回転に合わせて調整する必要があります。

表示の向きとデバイスの向き

センサーの基準軸について理解するために、画面の向きとデバイスの向きを区別する必要があります。画面の向きはテキストの向きであり、画面上に画像が表示されます。それに対してデバイスの向きは、デバイスの実際の配置です。次の図では、デバイスと画面の向きは共に Landscape です。

画面とデバイスの向きが Landscape

次の図では、画面とデバイスの向きが共に LandscapeFlipped です。

画面とデバイスの向きが LandscapeFlipped

次の図では、画面の向きが Landscape、デバイスの向きが LandscapeFlipped です。

画面の向きが Landscape、デバイスの向きが LandscapeFlipped です。

向きの値は、DisplayInformation クラスの GetForCurrentView メソッドと CurrentOrientation プロパティを使って照会することができます。次に、DisplayOrientations 列挙値と比較することによってロジックを作成できます。 サポートするすべての向きについて、その向きへの基準軸の変換をサポートする必要があることに注意してください。

横向き優先デバイスと縦向き優先デバイス

製造元は、横向き優先および縦向き優先のいずれのデバイスも製造できるようになりました。製造元がデバイスにコンポーネントを統合する場合、すべてのデバイスが同じ参照フレーム内で動作するように、統一された一貫性のある方法で行います。 次の表は、横向き優先デバイスと縦向き優先デバイスの両方のセンサー軸を示しています。

向き 横向き優先 縦向き優先

Landscape

Landscape の向きの横向き優先デバイス Landscape の向きの縦向き優先デバイス

Portrait

Portrait の向きの横向き優先デバイス Portrait の向きの縦向き優先デバイス

LandscapeFlipped

LandscapeFlipped の向きの横向き優先デバイス LandscapeFlipped の向きの縦向き優先デバイス

PortraitFlipped

PortraitFlipped の向きの横向き優先デバイス PortraitFlipped の向きの縦向き優先デバイス

 

表示と向きとコンパスの方位

コンパスの方位は基準軸に依存するため、デバイスの向きと共に変化します。 次の表に基づいて補正します (ユーザーが北を向いていると仮定します)。

表示の向き コンパスの方位の基準軸 北を向いている場合の API によるコンパスの方位 コンパスの方位の補正

Landscape

-Z

0

方位

Portrait

Y

90

(方位 + 270) % 360

LandscapeFlipped

Z

180

(方位 + 180) % 360

PortraitFlipped

Y

270

(方位 + 90) % 360

 

正確に方位を表示するために、表に示されているようにコンパスの方位を修正します。

function readingChanged(e) {
    var heading = e.reading.headingMagneticNorth;
    var displayOffset;

    // Calculate the compass heading offset based on
    // the current display orientation.
    var displayInfo = Windows.Graphics.Display.DisplayInformation.getForCurrentView();
    
    switch (displayInfo.currentOrientation) {
        case Windows.Graphics.Display.DisplayOrientations.landscape:
            displayOffset = 0;
            break;
        case Windows.Graphics.Display.DisplayOrientations.portrait:
            displayOffset = 270;
            break;
        case Windows.Graphics.Display.DisplayOrientations.landscapeFlipped:
            displayOffset = 180;
            break;
        case Windows.Graphics.Display.DisplayOrientations.portraitFlipped:
            displayOffset = 90;
            break;
     }

    var displayCompensatedHeading = (heading + displayOffset) % 360;

    // Update the UI...
}

加速度計とジャイロメーターでの表示の向き

表示の向きに合わせた加速度計とジャイロメーターのデータの変換を、次の表に示します。

基準軸 X Y Z

Landscape

X

Y

Z

Portrait

Y

-X

Z

LandscapeFlipped

-X

-Y

Z

PortraitFlipped

-Y

X

Z

 

ジャイロメーターにこれらの変換を適用するコード例を次に示します。

function readingChanged(e) {
    var reading = e.reading;
    var displayOffset;

    // Calculate the gyrometer axes based on
    // the current display orientation.
    var displayInfo = Windows.Graphics.Display.DisplayInformation.getForCurrentView();
    switch (displayInfo.currentOrientation) {
        case Windows.Graphics.Display.DisplayOrientations.landscape: 
            x_Axis = reading.angularVelocityX;
            y_Axis = reading.angularVelocityY;
            z_Axis = reading.angularVelocityZ;
            break;
        case Windows.Graphics.Display.DisplayOrientations.portrait: 
            x_Axis = reading.angularVelocityY;
            y_Axis = -1 * reading.angularVelocityX;
            z_Axis = reading.angularVelocityZ;
            break; 
        case Windows.Graphics.Display.DisplayOrientations.landscapeFlipped: 
            x_Axis = -1 * reading.angularVelocityX;
            y_Axis = -1 * reading.angularVelocityY;
            z_Axis = reading.angularVelocityZ;
            break; 
        case Windows.Graphics.Display.DisplayOrientations.portraitFlipped: 
            x_Axis = -1 * reading.angularVelocityY;
            y_Axis = reading.angularVelocityX;
            z_Axis = reading.angularVelocityZ;
            break;
     }

    // Update the UI...
}

表示の向きとデバイスの向き

OrientationSensor は別の方法で変更する必要があります。 複数の向きとして Z 軸に対する反時計回りの回転を考えてみます。この場合、ユーザーの向きを元に戻すには、回転を逆にする必要があります。四元数データの場合、オイラーの公式を使って、基準四元数により回転を定義できます。また、基準回転マトリックスを使うこともできます。

オイラーの公式

必要な相対的な向きを得るには、基準オブジェクトと絶対オブジェクトを乗算します。この演算は非可換であることに注意してください。

基準オブジェクトと絶対オブジェクトの乗算

前の式では、センサー データによって絶対オブジェクトが返されます。

表示の向き Z 軸を中心とする反時計回りの回転 基準四元数 (逆回転) 基準回転マトリックス (逆回転)

Landscape

0

1 + 0i + 0j + 0k

[1 0 0

0 1 0

0 0 1]

Portrait

90

cos(-45⁰) + (i + j + k)*sin(-45⁰)

[0 1 0

-1 0 0

0 0 1]

LandscapeFlipped

180

0 - i - j - k

[1 0 0

0 1 0

0 0 1]

PortraitFlipped

270

cos(-135⁰) + (i + j + k)*sin(-135⁰)

[0 -1 0

1 0 0

0 0 1]