Canvas RiderCanvas Rider is an experiment whose aim is to collect & render Free Rider tracks with HTML5. It's now been taken over by Kano Games' Free Rider HD.
Webブラウザ上で楽譜を描く·Vexflow MOONGIFT
VexflowはJavaScript製のオープンソース・ソフトウェア。Web上には無数のコンテンツが存在するが、それは主にテキストが主体になっている。数式のようなものでさえ画像で表現されることが多い。これは非常に勿体ないことだ。 テキストを使って表現できればシステムとの連携も容易になったり、Webクローラーに拾われてインデックス化することも考えられる。同様に表現しづらい情報である楽譜をJavaScriptで表示するのがVexflowだ。 Vexflowは一定のフォーマットに従って書かれたテキストをJavaScriptを使ってCanvas/SVGで表現したものだ。その表現力は非常に高く、音符を描くのはもちろん、数字やアルファベットを表示することもできる。ピアノのみならず様々な楽器に対応できるだろう。 他にも音符を線でつないだり、ト音記号を描いたりと高機能だ。JavaScriptなので、変更と
CanvasタグとJavaScriptで3Dのデモを作ってみました | ClockMaker Blog
HTML5というわけではないですが、CavasタグとJavaScriptを使って3Dのデモを作ってみました。 デモを見る ソースコード (［右クリック］→［ソースを見る］を選択) こういうのを見れば「HTML5すごい、Flashいらない」と思う人もいるかもですが、冷静にファーストインプレッションを。同じものを以前Flashで実装したことがありますが（Papervision3D演出サンプルNo.01:羽ばたく蝶々）、両者のデモを比較することでメリット・デメリットが見えてきます。 ＜追記：2013年9月3日＞ Three.jsの最新版rev 60にアップデートしてみました。3年前に作成したときはrev 17だったのですが、別物のライブラリと言わんばかりにほとんどAPIが変わってしまっています。ちなみにTypeScriptで書きなおしています。 デモを見る ソースコード (TypeScript)
HTML5 QRコード簡易ジェネレータ
Pure JavaScript + Canvas + SVG による QRコード簡易ジェネレータ
IO 9elements
Our company's top wizards, stuntmen, and industry experts offer their best advice, how-tos, and insights - all in the name of shockingly good code & design. Building a Rock Solid Auto GridExplore a customizable CSS auto-grid layout in our latest post. Adjust column widths, gaps, and max column count for flexible web designs. Ideal for any web project. Hosting a ComfyUI Workflow via APIBasic WebSoc
HTML5のcanvas2dの実装状況も調べてみた - IT-Walker on hatena
ふと興味がわいたので、タグの実装状況に引き続き、こちらも調べてみました。 Canvasを実装しているブラウザが、HTML5仕様にあるCanvasRenderingContext2Dインターフェースの属性やメソッドのうち、どれくらい利用可能にしているかどうかをざっくり調べてみました。 例によってテスト方法はあまり厳密ではなく、「メソッドや属性がオブジェクトに定義されているかどうか（undefinedかどうか）」と言うものです。個々のメソッドが仕様通りに動作するかどうかまではテストしてないです。なので、この表で保証するのは「これらの属性・メソッドにアクセスしても『XXX is undefined』と言われる事はない」というところまでです。 最後の方の「drawImage(Canvas|Image|Video)」とか「createPattern(Canvas|Image|Video)」とかは、引
ウェブリブログ：サービスは終了しました。
「ウェブリブログ」は 2023年1月31日 をもちましてサービス提供を終了いたしました。 2004年3月のサービス開始より19年近くもの間、沢山の皆さまにご愛用いただきましたことを心よりお礼申し上げます。今後とも、BIGLOBEをご愛顧賜りますよう、よろしくお願い申し上げます。 ※引っ越し先ブログへのリダイレクトサービスは2024年1月31日で終了いたしました。 BIGLOBEのサービス一覧
ニテンイチリュウ : Image Evolution
最初は、50個のポリゴンを重ねてモナリザを作ったよというRoger Alsing氏の記事だった。その発想と過程が非常に面白かった。 ソースコードが公開されるのを待っていたら、2日経って、同じことをjavascript+canvasで実装した別の人が登場！ Image Evolution 200x200ピクセルまでのイメージをアップロードすると、canvasで描かれた半透明のポリゴンで描画してくれます。その過程が非常に面白い。 canvasのgetImageDataのブラウザ実装の関係で、Firefox3.0.4/Opera9.61/Webkit r39090でのみ動作。WebKitでの実行が超高速なため、WebKit推奨。Safari3.2.1では動作しません。 また描画中の状態をDNAという形でインポート/エクスポートすることも可能。 その発想と技術力に脱帽。 必見！
ウェブリブログ：サービスは終了しました。
「ウェブリブログ」は 2023年1月31日 をもちましてサービス提供を終了いたしました。 2004年3月のサービス開始より19年近くもの間、沢山の皆さまにご愛用いただきましたことを心よりお礼申し上げます。今後とも、BIGLOBEをご愛顧賜りますよう、よろしくお願い申し上げます。 ※引っ越し先ブログへのリダイレクトサービスは2024年1月31日で終了いたしました。 BIGLOBEのサービス一覧
http://diaspar.jp/node/201
See related links to what you are looking for.
Bookmarklet: canvasを使って今見ている画像を角丸にする - mayokara note
IEでは動きません。 javascript:(function(){ var r = prompt("radius? (px)", "20"); if (!r) return; var c = document.createElement("canvas"), ctx = c.getContext("2d"); var img = document.images[0], w = c.width = img.width, h = c.height = img.height; var d90 = Math.PI/2; ctx.beginPath(); ctx.arc(r, r, r, d90*2, d90*3, false); ctx.arc(w-r, r, r, d90*3, d90*4, false); ctx.arc(w-r, h-r, r, 0, d90, false); ctx.ar
Processing.jsで魚の群れシミュレーション - p4lifeのメモ
Mozilla の John Resig さんが作った Processing.js をさっそく試してみました．プログラムのネタは今ホッテントリになっている「ほぼ日刊イトイ新聞 - がんばれ森川くんの遺伝子くん」の「群れの知能」に書いてある Boid（birdoid, Bird android）です． Boid は鳥や魚の群れの振る舞いを再現するアルゴリズムで，次の基本的なルールからなります．◆ルール1：近くの鳥たちと飛ぶスピードや方向を合わせようとすること◆ルール2：鳥たちが多くいる方へ向かって飛ぶこと◆ルール3：近くの鳥や物体に近づきすぎたら、ぶつからないように離れることhttp://www.1101.com/morikawa/2001-06-25.html群れの中の各個体をこのような単純なルールに従わせるだけで，一見複雑な動きを簡単にそれらしく再現することができます． 「群れの知能」を
ブラウザでお絵描きプログラミング！ Processing.js 登場！ - IT戦記
はじめに 今日、 jQuery の作者として有名な John Resig さんが Processing.js という JavaScript のライブラリを公開しました。 John Resig - Processing.js このライブラリを使うと、比較的簡単に以下のようなグラフィックスやアニメーションを書くことができるようになります。 というわけで、公開されたばかりのこのライブラリを簡単な使い方から詳しい使い方までとことん掘り下げてみたいと思います。 Processing.js 概要 まず、 Processing.js とは何かという話をします。 Processing.js とは、ブラウザで Processing というプログラミング言語を実行する JavaScript のライブラリです。 では、 Processing とはどのようなプログラミング言語なのでしょうか。 Processing
20行のJavascript+canvasでここまでできる | 秋元@サイボウズラボ・プログラマー・ブログ
# Internet Explorer不可 OZONE Asylumというフォーラムで出された今月のお題「20行のJavascriptでできるだけ多くのエフェクトを同じスクリーンに出す」に対して出てきたすごい答がこれ。 ソースを見ると、たしかに有効な行は20行しかない。 Opera9.5とFirefox3(どっちもまだベータ)で作者の意図どおり動くとのこと。Firefox2やOpera9でも動き自体は見えるが、Firefox2では光る効果が見えなかったり。 via del.icio.us/popular この記事は移転前の古いURLで公開された時のものですブックマークが新旧で分散している場合があります。移転前は現在とは文体が違い「である」調です。(参考)記事の内容が古くて役に立たなくなっている、という場合にはコメントやツイッターでご指摘いただければ幸いです。最新の状況を調べて新しい記事を書
ウェブリブログ：サービスは終了しました。
「ウェブリブログ」は 2023年1月31日 をもちましてサービス提供を終了いたしました。 2004年3月のサービス開始より19年近くもの間、沢山の皆さまにご愛用いただきましたことを心よりお礼申し上げます。今後とも、BIGLOBEをご愛顧賜りますよう、よろしくお願い申し上げます。 ※引っ越し先ブログへのリダイレクトサービスは2024年1月31日で終了いたしました。 BIGLOBEのサービス一覧
nihilogic: Super Mario in 14kB Javascript
Tuesday, April 8, 2008 224 comments Super Mario in 14kB Javascript Labels: games, javascript Here's an experiment in keeping things small and confined to one Javascript file. There are no external image files or anything, everything is rendered with Javascript using either canvas elements or old fashioned div-making tactics (for IE). The sprites are stored in custom encoded strings in a format tha
Firefox3のCanvasにFlashが映るのでYouTubeをスライスできるからやった(でもWindowsはだめ) « ku
補足 2008.3.12 Bug 313462 – plugin content not drawn via drawWindow()にファイルされていました。 This works fine on OS X on Trunk, but (I imagine) isn’t fixed in 1.8. Comment #26 って書いてあるのでOSXでは動く状態になったけど他がまだ、という状態みたい。 あと書かれている通りwmode="transparent"になっていればWindowsでも映るのを確認。でもふつうはwmode="transparent"になっていないのでWindowsだと事実上映らない。 この問題はVistaのタスク切り替えみたいにタブのサムネイル一覧を出したときに、Flashの部分が映らないのはnot attractiveだから直したいみたいなので期待してよさそう。 bu
[Javascript] "うごかせるモノである”事をアフォードするiPhone firmware1.1.3のEffect.wobbleを実装した。(Effect.illuminateと組み合わせたデモ)
iPhone / iPod touchユーザの皆さんは、Firmware1.1.3にバージョンアップしましたか？ Jail Breakが面倒なので、私のiPhoneは1.1.1のままですが、1.1.3にアップグレードしたiPod touchを入手したので、作りました。 「あるモノが動かせる」事をユーザに一番早く理解してもらうにはどうすれば良いか？ おそらく、ブラウザ上で一番使われているのは、CSSでマウスカーソルをcursor:moveにする方法だろう。それなりにコンピュータに触れているユーザならば、このアイコンが出れば「ん？動かせるのかな？」と気になる。しかし、マウスポインタの概念が存在しないiPhone / iPod touchではこの方法は使えない。iPhone / touch では、より動物の持つアフォーダンスに働きかける方法を採用している。 Apple Patent shows
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
http://youmos.com/news/mochaui