HTML5 Canvasでパーティクル表現！パーティクルエンジンParticleEmitterJS | ClockMaker Blog
にゃあプロジェクトさんに教えてもらったのですが、HTML5用のパーティクルエンジン「ParticleEmitterJS」が面白そうだったので試してみました。次のような表現がビジュアルエディターを使ってHTML5で簡単に作ることができます。 Demo (Require the browser supported HTML5 Canvas) Demo (Require the browser supported HTML5 Canvas) ParticleEmitterJS は CreateJS のフリーの拡張ライブラリで、簡単にパーティクルエフェクトを作ることができます。パーティクルエフェクトはゲームやコンテンツ表現の演出強化や、雲や炎などのシミュレーションにも利用できます。パーティクルは基本的に数値演算を利用するためプログラマの領分という印象が強いですが、ParticleEmitterJS
FN1209008 - EaselJSのオブジェクトを物理演算エンジンのBox2Dで落とす - HTML5 : テクニカルノート
「Box2D」はもともとC++で開発された2次元空間の物理演算エンジンです[*1]。重力と物体の質量や摩擦、弾性にもとづく位置と動きの物理計算を行い、シミュレーションしてくれます。ActionScript 3.0やJava、C#、Pythonなど、さまざまな言語に移植されています。JavaScriptのライブラリとしても、いくつか公開されてきました。その中でも対応するバージョンが新しく、解説も整っているBox2dWebを使ってみましょう。 01 物理空間と剛体を定める 物理演算エンジンというのは、物体の位置や動きの数値計算をするだけで、オブジェクトの座標を変えたりはしません。つまり、エンジンがいくら演算を進めても、コンテンツの見た目は止まったままです。演算結果をオブジェクトの座標に与えて、初めてアニメーションとして動きます。 物理演算のシミュレーションをする前に、定めておかなければならない
今度はTweenJSで遊んでみたテスト - ゆうなんとかさんの雑記帳的な。
というわけでなんとか今日のうちに動いてくれました。だがこれはねーよ Readmeにあるとおり、 見てくれがアレ過ぎるので要調整です。 見てくれがアレ過ぎるので要調整です。 見てくれがアレ過ぎるので要調整です。 長方形の全体像が見えてしまっているのももちろんですが、差し色を入れたりノイズの乗せたりする必要があります。 ひとまず差し色は入れました。色合いはこんな感じでしたよね？ 長方形の長辺をかなり長くして端の方をチラ見せする感じにするといい感じに移動速度がゆらいでくれたのが今のところの成果です。 まだまだ手を入れるところはあるので、これで完成とは言うつもりはないですよー、とだけいっておきます。
ActionScript入門Wiki - TweenJS
<script src="http://code.createjs.com/easeljs-0.4.1.min.js"></script> <script src="http://code.createjs.com/tweenjs-0.2.0.min.js"></script> window.onload = function() { // div要素で作った矩形 var div = document.createElement("div"); div.style.width = "50px"; div.style.height = "50px"; div.style.position = "absolute"; div.style.backgroundColor = "#000000"; document.body.appendChild(div); // divの幅を200pxに変更。
msto.jp - it転職 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
– このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネット(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2024年5月時点の調査。
FN1208001 - TweenJSでインスタンスにトゥイーンアニメーションを加える - HTML5 : テクニカルノート
CreateJS SuiteのTweenJSライブラリを使うと、いくつものトゥイーンを組合わせてインスタンスに加えられます。また、値の変化のさせかたも、さまざまなイージングの関数から選べます。TweenJSでインスタンスのトゥイーンアニメーションをつくってみましょう。 01 ランダムな塗り色で星形を描く インスタンスはShapeにして、星形を描くことにします。まだ、トゥイーンアニメーションは設定しません。「EaselJSで描いた星形を回す」で書いたコード001に少し手を加えたのが、以下のコード001です。Canvasの真ん中にランダムな色で星形が描かれます(図001)。 コード001■EaselJSでCanvasの真ん中にランダムな色の星形を描く <script> var createjs = window; </script> <script src="easeljs/utils/UID
jsdo.it
We’re getting things ready Loading your experience… This won’t take long.
Happy Elements Labs: ソーシャルゲームのアニメーションと CreateJS
エンジニアの草苅です。 突然ですが、ソーシャルゲームのアニメーションはどのようなライブラリやツールを使って実現されているかご存じでしょうか？ 今回はそのあたりを簡単にご紹介しようと思います。 ソーシャルゲームのアニメーションは大きく分けて、フィーチャフォン向けとスマートフォン向けの二つがあります。 フィーチャーフォン向けアニメーション ほとんどの場合、Flash Lite で制作されており、ほとんどの場合 ActionScript 1.1で作られています。 これは ActionScript 1.1 にすることでほとんど100%に近いくらいの携帯電話で動作させることができるからです。 ただ、Flash Lite はかなり制限事項（100kb制限など）が多いことから、バイナリ置換などでテキストや画像を差し替えたり、バイナリ文字列をつなぎ合わせて swf を
HTML5 Canvasを始めよう：EaselJSを使った流体パーティクル入門 | ClockMaker Blog
HTML5のCanvasをFlashライクに使えるようにするJavaScriptライブラリ「EaselJS」で流体パーティクルのデモを作ってみました。 demo source EaselJSを使えばFlashのようにHTML5 Canvasを使うことができるので、ActionScriptから概念だけではなくコードの再利用性が高まります。今回は流体パーティクルの表現を通して、EaselJSとCanvasのテクニックを紹介していきます。 デモの作り方 冒頭のデモですが、私が以前作成したFlashの作品「Flashの高速化を試す、BitmapDataを配列に格納することで2〜3倍の高速化」から移植したものです。 さて、このデモをHTML5 Canvasに展開するにあたり、特に抑えておきたいのは次の点だと思いました。 フォースマップの作成 パーティクル情報を付与した表示クラスの作成 フォースマップ
– このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネット(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2024年5月時点の調査。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【ADC MEETUP 06】インタラクティブなリッチコンテンツの制作を支援するライブラリ「CreateJS」
http://shallaazm.com/createjs/easeljs/tutorials/HitTest/
EaselJSでTextをDrag and Drop - The Catcher in somewhere
http://kudox.jp/java-script/createjs-tweenjs
kudox.jp
http://www40.atwiki.jp/spellbound/pages/1902.html