web-dev-qa-db-ja.com

ファイルからキャンバスへの写真の描画は、Chrome EXIFに基づいて)回転します

Chromeは、exifデータに基づいて、キャンバスに描画されたファイル入力からの画像を自動回転します。これはすばらしいことですが、iOSでは同じことができません。自分で画像を変換できるように、この動作を防ぐ方法はありますか? iOSで機能するように書いた修正で、その修正を無効にするとAndroid ...むしろ無効/有効にしてからブラウザを識別するゲームをプレイします。

画像のスタイルをimage-orientationに設定してみました。 ....しかし、それは何もしませんでした。まだそれを回転させました。

編集:これは、スタイルオブジェクトの「imageOrientation」が未定義であるか、新しく作成されたimgタグで空の文字列であるかを確認することで検出されました。多分完璧なテストではないかもしれませんが、私がテストした私の状況ではうまくいきました。それがどれほど将来の証拠になるかはわかりません。

3
Chase R Lewis

DOMの一部であるキャンバスに描画している場合、canvasではなくimg要素にCSSを設定すると、これが修正されます。

canvas {
    image-orientation: none;
}

計算されたスタイルを使用するため、記述時点では要素はDOM内にある必要があります。それはDOMコンテキストにのみ存在します。この問題の詳細については、Chromiumトラッカーをご覧ください。

https://bugs.chromium.org/p/chromium/issues/detail?id=15875

0
Derek H

このテストを使用して、ブラウザーを区別することができました。

if (CSS.supports("image-orientation", "from-image")) {
    ...
}
0
matt burns