ブラウザ上で高度なグラフィックを描画できるWebGL。また、HTMLには多彩なAPIが備わっています。今回はiPhoneでも動作する3Dの写真ビューアーを作ってみました。本記事では次の4つの技術を中心に解説します。 ファイルの取り扱いAPI ドラッグアンドドロップのAPI デバイスの傾き検知処理 WebGL デモを再生する(別ウインドウが開きます) ソースコード ※ Androidについては手元の環境では動作しませんでした。 iPhoneでの動作ビデオ 実際にiPhoneで動いているデモは以下の動画です。iPhone 5Sです。 STEP1. ファイルのアップロード方法 HTML5で登場したFile APIを使用すると、ローカルからファイルをアップロードすることができるようになります。ここでは、input要素を使う方法と、ドラッグアンドドロップを使う方法を紹介します。デモでは、demo.F
![HTML5のFile APIとWebGLを利用した3D写真ビューア - ICS MEDIA](https://cdn-ak-scissors.b.st-hatena.com/image/square/f03772a3430fbdcbc192b31a1807e0e96f74feb3/height=288;version=1;width=512/https%3A%2F%2Fics.media%2Fentry%2F2489%2Fimages%2Feyecatch.jpg)