[B! canvas] Neanのブックマーク

第27回　ランダムな楕円軌道を描くパーティクルの仕上げ | gihyo.jp

前回の第26回「パーティクルを使い回しながらさまざまな楕円軌道で回す」では、速度からランダムに導いた楕円軌道でパーティクルを回してみた。今回は、そのランダムをさらにばらつかせる。そして、楕円運動の速度から位置を求める方程式についても、数学的な説明を補おう。パーティクルの動き始めもランダムにする前回できあがりの第26回コード4「パーティクル100個を使い回しながらさまざまな楕円軌道で回す」では、すべてのパーティクルが一斉に動き出す。そのため、パーティクルの動きが揃って同じ位置に集まってしまう（図1⁠）⁠。つぎのようにパーティクルの数（total）を増やしてみるとわかりやすい。ただし、オブジェクトを使い回して設定し直す関数（resetParticle()）により、つぎの再設定時（lifetime）がランダムに定められるため、動きのばらつきはやがて広がる（第26回「100個のパーティクルを使

Nean 2014/06/09

リンク

要約: Apple iPhone5のページのJPEGとJSとcanvasタグによるビデオの実装がやばいという話

2012 年 9 月 26 日追記しました。要約エントリー。元記事 : iPhone 5 website teardown: How Apple compresses video using JPEG, JSON, and <canvas> アップルのサイトの iPhone5 のページにある「スライドしてアンロック」のアニメーションが、信じられない実装になっている、という話。簡単に要約してみた。（ミスなどの指摘は @lowply までお願いします）もともと h.264 と WebM の動画フォーマット戦争でブラウザ互換性の問題がまだ残っている上、iPhone などは「再生ボタン」を押さないと再生できなかったりするので、こうした短いアニメーションに video タグを使うことは最適解ではなかったらしい。そこで発想の転換をして、Retina MBP のページでは、蓋が開くたった 2

Nean 2012/09/25

リンク

GSkinnerの作ったJavaScriptライブラリが素敵すぎる件 | fladdict

Flash界のコーディングゴッドGSkinnerがJavaScriptのCanvasをFlashライクに使うライブラリを作った。この人、確か僕と同い年ぐらいかちょい下なんだよね。。。会う度に超へこむ。画期的というか、確実にかゆいところに手が届くライブラリで、下みたいなのがサクサクJSでいける。あいかわらずソースは美しいし、ドキュメントも完備。 game sparkles rollover localToGlobal globalToLocal sprite sheets ざっと見た感じFlashでいうところの、Stage, MovieClip, Sprite, Bit map, Matrix, Stage, EnterFrameとキーフレームアニメがサポートされてる感じ。これは素敵。このライブラリそのものもスゴいんだけどポイントは、GSkinnerがJSやりだしたってことは、365日以

Nean 2010/12/21

リンク

vexflow - Google Groups

Nean 2010/11/22

リンク

VexFlow - HTML5 Music Engraving

VexFlow is an open-source online music notation rendering API. It is written completely in JavaScript, and runs right in the browser. VexFlow supports HTML5 Canvas and SVG. VexFlow has been in development for over 10 years, and used by apps, startups, universities, in all kinds of amazing ways. If you find VexFlow useful, please consider sponsoring me on GitHub.

Nean 2010/11/22

リンク

HTML5とJSでWEB上に綺麗な楽譜が書けるライブラリ「VexFlow」:phpspot開発日誌

VexFlow - HTML5 Music Engraving HTML5とJSでWEB上に綺麗な楽譜が書けるライブラリ「VexFlow」。 Canvas+SVGで描画され、次のように綺麗に描画できます。たとえば、次のようにテキストで表現します。 tabstave notation=true notes 4-5-6/3 10/4 次のように描画されます。チュートリアルをみると結構複雑なものも描画できるみたいです。私自身、楽譜は全く読めませんが、面白いライブラリですね。