写真を読み込むと画像が回転されてしまう

Question

スマホブラウザで下記のように写真を読み込んでいるのですが
読み込んだ画像が回転されて表示されるのですが
解決する方法はないでしょうか。

$("#imp").change(function (evt) {
                    
   var file = evt.target.files;
   var reader = new FileReader();
   reader.readAsDataURL(file[0]);
   reader.onload = function ()
         {
         document.querySelector('#pic').src = reader.result;
          };
});

Comments

[m.ts10806]

「スマホブラウザ」にもいろいろあります。機種やOS、ブラウザを明記してください

Answer 1

JSであればJavaScript-Load-Imageのようなモジュールを利用してみてはいかがでしょうか。
exif情報のorientationを取得して、取得した値によって画像を反転・回転させて描画するという方法で解決できると思います。

data.exif.get('Orientation');

Comments

[Qoo]

ありがとうございました！助かりました！