CSS3で疑似3D表現を実現するSprite3D.jsを触ってみた | KnockKnock
JavaScriptとCSS3だけで疑似的に3D表現を行うことができるSprite3D.jsを、モックアップ作成ついでに触ったので投稿します。 Sprite3D.jsソース Sprite3D.jsドキュメント このライブラリは、Tree.jsのように、WebGLをサポートした3D描画ライブラリとは違い、CSS3のtranslate3dを使って、画像にパースをかけて疑似的に3D表現を付与するライブラリです。そのため計算処理が少なく、処理が軽いことが特徴です。もちろん疑似的なD3表現のために出来ることが限られていますが、ブラウザゲームを作るといったこと以外では、これで十分ではないかと思われます。処理が軽いことでスマートフォンやタブレットで動かすことも現実的ですが、IE9以下ではperspectiveをサポートしていないために使用できません。 かんたんなサンプルを作成しました。 33～28行目
JavaScriptによる簡易的な3D表現の実装 - Qiita
はじめに 計算機のハードウェアの進歩により、最近では3D表現を用いたゲームやプログラムは手軽なものになりました。例えばJavaScriptではThree.jsのようなライブラリを用いることで手軽に3D表現を用いた作品を作ることができます。 今回は上記のようなリッチなライブラリには目もくれず、原始的な3D表現をJavaScriptで実装しようと思います。趣旨としては、簡易的な3D表現の単純さ、JavaScriptエンジンのパフォーマンスの体感、あたりになります。JavaScriptの実行エンジンはとても高度に最適化されており、C言語と同等までには届きませんが、スクリプト言語としてはとても高速に動作することが特徴です。 真面目に向き合わなければならない課題はきちんとこなしつつ、JavaScriptの高速さの影に隠れて楽をできるところは楽してしまおう、という感じで進めていきたいと思います。 作る
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
