気軽にブラウザで3Dコンピュータグラフィックス(以下3DCG)を実装できる、WebGL、three.jsの記事を書いてみました。
WebGL、three.jsでワクワクしてみた | Tech Blog | CRESCO Tech Blog
気軽にブラウザで3Dコンピュータグラフィックス(以下3DCG)を実装できる、WebGL、three.jsの記事を書いてみました。
WebGLを使ってブラウザ上で3Dモデルを描画した話 - DMM.comラボエンジニアブログ
皆様、はじめまして！DMM.com Labo システム本部 事業サービス開発部の久野です。この度、社内の勉強会のLTで話した内容をまとめてみました！ 内容はWebGLというJavaScriptのAPIを使って、ブラウザ上で3Dモデルをアニメーション付きで描画するために何を行ったのか、です。 ▼実際に動作するデモです。 テクスチャを大量に読み込まなければならないので表示まで時間がかかるかもしれません。 ▲ブラウザによっては動作しない可能性がありますがデモプログラムなので悪しからず。 WebGLとはなんぞや？ WebGLとはKronos Groupが管理するOpenGL ES 2.0をブラウザ上のJavaScriptから扱えるようにしたAPIです。GPU(グラフィックカードまたはグラフィックボード)の機能を駆使して高度な3D描画を高速に行うことが出来、昨今のPC、スマートフォン等の主要なブラウ
プログラミング初心者からthree.jsに慣れるまで｜misaki nakano
こんにちは。 私は現在クリエイティブディベロッパーという、フロントエンド＋WebGL 実装する仕事を2年半ほどやっています。 1年半東京の会社で働いたあと半年間フリーランスをして、その後アムステルダムの会社に入社して現在8ヶ月経ちます。 three.jsで絵を作るのが好きで、仕事でもプライベートでもこんなかんじのものを作っています。ほとんどtwitterにあげてるので、興味がある方はぜひ見てみてください。 最近ツイッターのDMでどうやってthree.jsを勉強すればいいかアドバイスが欲しいというのをもらうことが多くなってきたんですが、この質問に答えるのは難しいなと感じています。 人によって得意不得意があるし、始めようと思った時点でどのくらいプログラミングや数学に精通しているか人それぞれすぎて、これがベストな勉強法！これをやれば誰でも大丈夫とは言えないです。 この記事では、私が初心者レベルか
WebGLフレームワーク「Babylon.js 3.3.0」リリース！VR向けGUI対応、パーティクルエフェクト強化、動画キャプチャー機能など - ICS MEDIA
WebGLフレームワーク「Babylon.js 3.3.0」リリース！VR向けGUI対応、パーティクルエフェクト強化、動画キャプチャー機能など 前回の記事『「編隊少女 -フォーメーションガールズ-」における3Dレンダリング技術解説』では、WebGLフレームワークBabylon.jsの採用事例を紹介しました。そのBabylon.jsの最新版（3.3.0）が2018年10月4日にリリースされましたので、最新機能をサンプルコンテンツ、ソースコードと合わせてお届けします。 3D GUIを簡単に作成 VRコンテンツ向けのGUIを簡単に作成できるMicrosoft Mixed Reality Toolkit（MRTK）の2つの機能が追加されました。 3Dボタンを簡単に格子状に配置できる機能。空間上の座標を意識することなく、GUIを構築できます。格子形状のカスタマイズも可能です。（扇形状にボタンを配置、
毎日GLSLでアニメーションを作ってる - マルシテイア
最近GLSLやWebGLの世界に入門して、毎日こんなアニメーションを作っている。 4月末、東京に出張する機会があり、ついでに何か面白いイベントや展示がないか探していると、チャネルというイベントを見つけた。 以前から気になっていたBRDG/VRDG方面のイベントらしい。 会場は六本木のSuperdeluxe。出張先のオフィスからも近いので、少し早退して行ってみる事にした。 そこではハードな電子音に合わせて、GLSLやHaskellのライブコーディングによるVJが行われていた。 先週末に開催したチャネル#16 のライブ映像を公開しました。 https://t.co/YgpC3YYC0B #unity3d #tidal #maxmsp #tokyo #BRDG #livecoding #kodelife pic.twitter.com/rWaHodipUA— BRDG / VRDG (@toky
東京メトロの運行データから作られたリアルタイムシミュレーションマップ「metrogram3D」
東京にはたくさんの路線が蜘蛛の巣のように張り巡らされており、初めて東京で電車に乗った人からすれば「なんでこんなにたくさんの電車が走っているんだ？」と混乱するのも仕方がないもの。そんな東京を走る電車の代表格である「東京メトロ」の運行データを視覚的に分かるようにしたサイトが「metrogram」、さらにWebGLを使って運行データを3Dで表現することで各駅の「深さ」や位置関係がより分かりやすくなったのが「metrogram3D」です。東京メトロだけでも電車が走りまくり＆線路が縦横無尽に張り巡らされまくりというのが一目瞭然で、東京に行ったことがある人もない人も、なんだかよく分からないけれども「東京スゲェ」という気分になれます。 metrogram3D http://nulldesign.jp/metrogram3d/ 実際に「metrogram3D」を開くと以下のようなシミュレーションマップが見
WebGL Water
Made by Evan Wallace This demo requires a decent graphics card and up-to-date drivers. If you can't run the demo, you can still see it on YouTube. Interactions: Draw on the water to make ripples Drag the background to rotate the camera Press SPACEBAR to pause and unpause Drag the sphere to move it around Press the L key to set the light direction Press the G key to toggle gravity Features: Raytrac
マウスで簡単に間取り図を作成しWebGLで立体化して中を動き回れる「Wanaplan」
家を購入したり、新しい土地へ引っ越す時に、不動産屋を訪ねて物件を回るのはなかなか骨が折れるもの。そんな時に便利な、クリックしていくだけで簡単に3D間取り図を作成＆立体化させて「この間取りの部屋に住むとどういう感じになるのか？」ということを体験できるのが「Wanaplan」です。WebGLで作られており、平方メートル単位で細かく間取りを設定することもでき、家具や扉などの小物を配置して自分の理想のおうちを仮想体験することもでるようなので、実際に使用してみました。 Wanaplan - WebGL application to create 2D/3D plans http://www.wanaplan.com/en/plan/ 3D間取り図を作成するには、「Try Wanaplan」をクリック。 すると2Dの間取り図が開きます。 壁のラインをドラッグして移動させると間取りの拡大・縮小が可能。
ブラウザーの3D表現もここまで来た！WebGLを使った驚きのWebサイト
ブラウザーで3次元コンピュータグラフィックスを表... / WebGLを使った3D表現 / SculptGL他...全13件 ブラウザーで3次元コンピュータグラフィックスを表示させるための標準仕様「WebGL」。Microsoftも重い腰を上げ、次期バーションの「IE11」からWebGLを標準サポートすることが決定しています。これからますます目にする機会が増えそうです。 そんな、圧倒的な3D表現が可能なWebGLを使った驚きのWebサイトを集めました。
『如何算平码』 · MSC地中海邮轮“华丽号”东西地中海全览15日之旅-Mobile
澳门澳门澳门精准大全(中国)有限公司董事、生物医药首席技术官Christian Bachofen先生接受了《制药业》专访 “客户的成功就是我们的主要目标。”近日，澳门澳门澳门精准大全(中国)有限公司董事、生物医药首席技术官Christian Bachofen先生接受了《制药业》专访时说道。以下为采访原文，转载自《制药业》公众号。 制药企业建设制药设施需要大量的投资，如果设施建设能够符合国家规范要求，实现成本可预测，缩短产品上市时间，而且具有未来重新规划的灵活性，对于制药企业来说意义重大。 Christian Bachofen先生 国际知名生物医药设计规划专家、澳门澳门澳门精准大全工程科技集团董事、生物医药首席技术官 一个项目从筹划到完成，前期设计在其中发挥着举足轻重的作用。工程行业通常将概念设计和初步设计统称为前期设计，作为详细和施工图设计的基础。Christian Bachofen指出，
Google マップ GLベータ版 をリリースしました
本日、ブラウザでより立体的な地図を体験できる Google MapsGL ベータ版をリリースしました。Web グラフィックライブラリー (WebGL) とは、プラグインを新たにインストールしなくても、お使いのブラウザでビジュアルやアニメーションをより鮮明にする表現できる新しいウェブ技術です。Google マップに WebGL を採用することで、建物のリアルな 3D 表示、画像間のスムーズな切り替え、ストリートビューへの滑らかな移行など、マップの使い心地が一段と向上しました。 Google Chrome 14 以上、または Firefox Beta 版等、一定要件を満たすブラウザとビデオカードがあれば、MapsGL の初期ベータ版をお試しいただけます。maps.google.co.jp にアクセスして [ 新しいマップテクノロジーを使ってみませんか ] をクリックしてください。 WebGL
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://jp.techcrunch.com/2019/07/28/note-comic-viewer/
WebGLを使ったマンガビューワを作っている - daiiz
GitHub - MicrosoftEdge/WebGL: Microsoft Edge WebGL Implementation
GitHub - yomotsu/gl-slideshow: A JavaScript library for advanced 2D slideshow with WebGL, that provides variety of beautiful effects
aasen.in