ゲーム開発 - Web ゲーム用の 2D 描画技法とライブラリ
このブラウザーはサポートされなくなりました。 Microsoft Edge にアップグレードすると、最新の機能、セキュリティ更新プログラム、およびテクニカル サポートを利用できます。 Web ゲーム用の 2D 描画技法とライブラリ Michael Oneppo これまで長い間、対話型 Web ゲームを作成するには実質的に Flash 以外の方法がありませんでした。好き嫌いはさておき、Flash には高速な描画システムがありました。アニメーション、ポイント アンド クリック方式のアドベンチャー ゲームなど、あらゆる種類のゲーム要素には Flash が使われていました。 HTML5 の登場に伴い各種ブラウザーが揃って Web 標準に準拠するようになると、プラグインが不要で高速かつ高品質なグラフィックを開発するための選択肢が、文字どおり爆発的に増えました。この記事では、描画手法の簡単なサンプルを
Web Audio API用のMMLイベントシーケンサー wamml です - 音の鳴るブログ
2014.08.20 名前を変更しました。 wamml => MMLEmitter Web Audio API用のMMLイベントシーケンサーを作りました。 MMLEmitter- GitHub MMLEmitter - online playground 概要 音楽プログラムを大雑把に説明すると 楽器 (音色) 譜面 (音程とタイミング) の二つの要素を解決するプログラムと言えます。MMLEmitter はこの 譜面 の部分のみを解決するライブラリです。AudioContext と MML を引数にシーケンサーを生成して起動すると、MML に記述したタイミングでイベントが発火するので、そこで音を出す処理を行います。Web Audio API 依存なので今のところ(サポートされないかぎり) IE では動作しません。あ、MML というのは楽譜を文字列で表現するための記法です。 MML - Mu
JavaScript で流体シミュレーションを試してみるテスト - CX's Hatena Blog
最近、Google から物理エンジンに関して面白そうなライブラリが登場したようなので jsdo.it で試してみました。 Googleがオープンソースの2D物理エンジンLiquidFun 1.1をリリース このライブラリは「Box2D」（2D の物理エンジンライブラリ）に、流体シミュレーション関連の機能を拡張したライブラリとなっているようです。 （ちなみに、JavaScript 版のライブラリは、C++ 版を Emscripten でコンバージョンしたものとなっているようです。） Wave Machine Particles Soup Soup Stirrer Impulse Rigid Particles Elastic Particles Surface Tension Theo Jansen サンプルを動かしてみるだけでも、結構楽しいので、興味がある方は試してみては如何でしょうか。
Matter.js でゴゴゴとドドドを物理演算してみるテスト - CX's Hatena Blog
ここ数日、2D 物理演算がマイブームです。 JavaScript の 2D 物理演算ライブラリとして「box2dweb」をサンプルをよく見かけますが、 シェイプと剛体を個別に作成する必要があり、個人的には、ちょっと使いにくい印象です。 そこで、比較的、最近登場した物理演算ライブラリ「Matter.js」を使ってみることにしました。 このライブラリは機能的に「box2dweb」と遜色なく、後発なだけに、API も整理されていて分かりやすいです。他のライブラリに比べてコンパクトな点も特徴です。 ゴゴゴとドドド ゴゴゴのコード（抜粋） シェイプの Path は SVG ライクに記述する仕様のようです。 for (var i = 0; i < 3; i++) { var x = 100 + i * 10; var y = 100 - i * 100; var shape = { label: 'S
jsdo.it で試してみたライブラリの一覧 - CX's Hatena Blog
昨日の記事の続きです。 jsdo.it を１年間続けて分かったこと - CX's Hatena Blog jsdo.it で試してみたライブラリをカテゴリ別にまとめてみました。 「→」にあるリンクは各ライブラリに対するサンプルになります。 2D（Canvas 系） Pixi.js https://github.com/GoodBoyDigital/pixi.js → pixi.js でドット絵を変形させるテスト - jsdo.it EaselJS https://github.com/CreateJS/EaselJS → EaselJS でレゴっぽくドット絵を作るテスト - jsdo.it Fabric.js https://github.com/kangax/fabric.js → fabric.js でドット絵を描いてみるテスト - jsdo.it Paper.js https://g
SVG で某試験の解答を描いてみるテスト - CX's Hatena Blog
春の某試験に向けて勉強をしているのですが、息抜きに、SVG を使って、問題の解答を描いて見ました。 1.素の SVG で図を描いてみる 2.ライブラリ＋JavaScript を用いてアニメーションさせてみる なお、ライブラリとして Snap.svg - Home を使用してみました。 Snap.svg は Raphael.js の作者による SVG のライブラリで、Raphael.js との大きな違いは、モダンブラウザを対象にしている点とのことです。 ライブラリに助けられている部分は、ありますが、JavaScript でアニメーションを同期的に表示するのは意外に難しいのだと感じました。（単に、自分が、使い方を理解してないだけかと思いますが。。。） おまけ 以前、HTML5 Canvas を用いて、某クイズの解答をアニメーションで作っていたことを思い出しました。 アニメーションで表現した方が
Snap.svg - The JavaScript SVG library for the modern web.
Why SVG (and Snap)? SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM. Modern features for modern browsers Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking
png to script - jsdo.it - Share JavaScript, HTML5 and CSS
All library need for game in 163kb png file. Each pixel is one ascii character look sphere texture. library used Three.js, Oimo.js, Sea3d, Rvo.js, TweenLite. green ball control by oimo red ball control by rvo var head = document.getElementsByTagName('head')[0]; var info = document.getElementById('info'); var sourceInfo = ""; var img = new Image(); img.onload = function() { var t01 = Date.now(); va
Away3D で地球を回してみるテスト - CX's Hatena Blog
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 １日目OpenGL で地球を回してみるテスト C/C++ ２日目DirectX で地球を回してみるテスト C/C++ ３日目Java 3D で地球を回してみるテスト Java ４日目WebGL で地球を回してみるテスト JavaScript ５日目Three.js で地球を回してみるテスト JavaScript ６日目Babylon.js で地球を回してみるテスト JavaScript ７日目gl.enchant.js で地球を回してみるテストJavaScript ８日目PhiloGL で地球を回してみるテスト JavaScript ９日目CubicVR.js で地球を回してみるテスト JavaScript ⇒最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回して
CubicVR.js で地球を回してみるテスト - CX's Hatena Blog
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 １日目OpenGL で地球を回してみるテスト C/C++ ２日目DirectX で地球を回してみるテスト C/C++ ３日目Java 3D で地球を回してみるテスト Java ４日目WebGL で地球を回してみるテスト JavaScript ５日目Three.js で地球を回してみるテスト JavaScript ６日目Babylon.js で地球を回してみるテストJavaScript ７日目gl.enchant.js で地球を回してみるテストJavaScript ８日目PhiloGL で地球を回してみるテストJavaScript ⇒９日目CubicVR.js で地球を回してみるテストJavaScript 最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回してみるテ
gl.enchant.js で地球を回してみるテスト - CX's Hatena Blog
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 １日目OpenGL で地球を回してみるテスト C/C++ ２日目DirectX で地球を回してみるテスト C/C++ ３日目Java 3D で地球を回してみるテスト Java ４日目WebGL で地球を回してみるテスト JavaScript ５日目Three.js で地球を回してみるテスト JavaScript ６日目Babylon.js で地球を回してみるテストJavaScript ⇒７日目gl.enchant.js で地球を回してみるテストJavaScript ８日目PhiloGL で地球を回してみるテストJavaScript ９日目CubicVR.js で地球を回してみるテストJavaScript 最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回してみるテ
asahi.com（朝日新聞社）：村の議事録に音声認識 手ごわい「なまり」 岩手 - 社会
パソコンの音声認識ソフトが読み取った言葉が表示された画面＝岩手県滝沢村役場 岩手県滝沢村役場でパソコンの音声認識技術を使って、役所の会議の議事録やミーティングの会議録の作製を軽減する実証実験が行われている。職員がＩＣレコーダーなどの録音をおこす作業時間を軽減させる狙いだ。将来はソフトに盛岡広域圏のなまりや行政用語を覚えさせるという。 話した言葉が１、２秒後に文字になるシステムの環境調査をしており、実験は２月１０日から約１カ月間、行われている。６件ほどの会議や部内のミーティングで、なまりや行政用語が認識できたか、会議室の環境、議事録作成の時間などの課題を調査。その上で、新たな音声辞書の作成などに役立てる予定だが、現段階ではなまりの認識は難しいという。 昨年１２月、村の産学官連携補助事業に、同村の貸し研究室「滝沢村ＩＰＵイノベーションセンター」に入居するソフトウエア会社「岩手インフォメー
カラー画像のノイズを除去するOSS | スラド
本家記事で、カラー画像のノイズ除去などの正則化を行う (regularization) オープンソースソフトウェア (OSS)「GREYCstoration」が紹介されている。非線形multi-valued diffusion PDE (多値拡散偏微分方程式 ?) を用いる最先端技術に基づくもので、アルゴリズムの詳細はTop Page下部の"Related publications"を参照してほしい。デモのページでは、ノイズ除去の例としてJPEG画像特有のブロックノイズ除去、画像修復 (画像中の余計なものを消去する) の例として格子除去や字幕除去を示している。このソフトウェアはCeCILLライセンスという「GPL相当の」フリーソフトウェアライセンスで提供されている。Windows (32bit:9x,2k,XP)、Linux (32bit)、Mac OS X (PPC) 用のコマンドライン
https://support.microsoft.com/dllhelp/
All Microsoft Microsoft 365 Office Windows Surface Xbox Deals Support Software Windows Apps OneDrive Outlook Skype OneNote Microsoft Teams Microsoft Edge PCs & Devices Computers Shop Xbox Accessories VR & mixed reality Phones Entertainment Xbox Game Pass Ultimate Xbox Live Gold Xbox games PC games Windows digital games Movies & TV Business Microsoft Azure Microsoft Dynamics 365 Microsoft 365 Windo
JavaScriptで線を描画するためのGraphicsクラスライブラリ:phpspot開発日誌
Drawing lines in Mozilla based browsers and the Internet Explorer - The Code Project - JavaScript JavaScriptで線を描画する方法についての記事。 JavaScriptで線を描画するためのGraphicsクラスライブラリも配布しているようです。 Graphicsクラスライブラリを使うと、次のような簡単なコードで線を描画できるようです。 var g = new Graphics(); g.drawLine(100,50,200,70); g.paint(); ダイナミックなインタフェースを実現するJavaScript ライブラリも多いですが、 こういったJavaScriptでの図形描画機能についてもおさえておきたいですね。 関連エントリ ブラウザ上で動作するJavaScript製のMSペイ
いまどきのデスクトップ処理系 steps to phantasien t(2006-09-22)
いまどきのデスクトップは色々モダンになっている. ただモダン化は API の裏側で進んでいるため, あまり興味を持たれていないらしい. 一見いろいろウォッチしていそうな知り合いと話していてわかった. 利用者視点の話題では, いまどきのデスクトップというとたとえばウィンドウが ヘナヘナ揺れるといったアイ・キャンディばかりが連想される. でもそのアイ・キャンディに至るにはきっと山ほど苦労があったはず. そのへんをちょっとねぎらってみたい. 念頭にあるのは Windows Vista, Mac OSX, XGL あたり. まず共通の階層化されたアーキテクチャを想定し, ケーススタディを交えつつその層を下から上へ順にたどっていきます. 復習: デスクトップ処理系の階層構造 そもそもデスクトップの中味はどんな構成をとっているのか. ざっと眺めておこう. 典型的なデスクトップ処理系のアーキテクチャはだ
サーバー・サイドPDF生成ライブラリPDFlibの新版，日本語対応を改善
ドイツPDFlibは2006年9月，サーバー・サイドPDF生成ライブラリPDFlibの新版「PDFlib 7」を発売する。現行バージョンでは日本語，中国語，韓国語のテキストに関して制約事項があったが，PDFlib 7ではそれらの多くを取り除き，シフトJISテキストの整形などが可能になったという。 PDFlibはJava，PHP，Cに対応したサーバー・サイドPDF生成ライブラリ。PDFlib 7ではすべてのTrueTypeフォントおよびOpenTypeフォントでの縦書きに対応した。Acrobatの定義済み日中韓フォントをUnicodeエンコーディングで利用することが可能になった。 現行バージョンのライセンス体系はCPUベースだが，PDFlibではマシンの数をベースとする方式に変更する。マルチコアのプロセッサが増加したことに対応するものという。現在ベータ版を公開しており，PDFlibの日本語サ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Babylon.js docs
WebGL
テクノロジー : 日経電子版
