canvas
リリースしました。 uupaa-selector.js Version 2.0 (ChangeLog) uupaa-mutationevent.js Version 0.1 (ChangeLog) uupaa-excanvas.js Version 0.1 (ChangeLog) uupaa-detect.js Version 1.0 (ChangeLog) uupaa-color.js Version 3.0 (ChangeLog) 内訳は世界…
11/1 の思いつきから始まった「Silverlight + VML = HTML5::Canvas」も、やっと一段落しました。 実装済みの機能 clearRect, beginPath, moveTo, lineTo, bezierCurveTo, quadraticCurveTo, rect, strokeRect, fillRect, closePath, drawImage(キャンバスの…
VMLモードで clip を実装できないかと try 〜 error を繰り返しています。VMLにはクリッピング用途に使える機能がほとんど見当たりませんし、ExplorerCanvasの開発チーム(Googleの中の人 × 3名様)が出来なかったことを(clipに限らず色々と)やろうとしている…
VMLモードのレンダリングを改善しました。細かなことは昨日の日記などをご覧下さい。 Silverlightモードの変更箇所 fillText(), strokeText() を実装 (ただし strokeText() は fillText() と同じレンダリングを行う)。 A canvas fillText and strokeText exa…
追記: サンプルを追加しました。 実装済みの機能 clearRect, beginPath, moveTo, lineTo, bezierCurveTo, quadraticCurveTo, rect, strokeRect, fillRect, closePath, createLinearGradient, createRadialGradient, stroke, fill, arc, save, restore, trans…
必須と思われる機能をあらかた実装できました。 実装済みの機能 clearRect, beginPath, moveTo, lineTo, bezierCurveTo, quadraticCurveTo, rect, strokeRect, fillRect, closePath, createLinearGradient, createRadialGradient, stroke, fill, arc, save, …
長さが 32598 だと問題なしで、33533 だとエラーが発生するため、32768 辺りに境界が有ると思われる。 # MSDNにはその手の記述はなし。この制限により、https://developer.mozilla.org/samples/canvas-tutorial/5_2_canvas_translate.html の右上と中央の図…
現状 デモ バウンドするドット excanvas.js(ver0.2)でレンダリング VMLモードでレンダリング Silverlightモードでレンダリング 回転するボックス excanvas.js(ver0.2)でレンダリング VMLモードでレンダリング Silverlightモードでレンダリング # IE以外のブ…
「Silverlight で HTML5::Canvas を実現できないか」から早5日(うち3日はサボり)。ぼちぼち動くようになってきました。 今回書いたライブラリは、Silverlightがインストールされている環境ではSilverlightを使い、インストールされていなければ、VMLでレンダ…
ある程度の描画速度の改善と、描画品質(拡大/縮小)の大幅な改善に成功しました。 速度的なロスを回避しつつ描画品質を改善できたときは、心の中でガッツポーズがでました。 ほかに大きな問題が見つからなければ、DataURIをデコードする機能をリリースできそ…
IE5,IE5.5,IE6,IE7 とおよそ10年に渡り、実装されなかった機能の一つに、Dataスキーム(DataURI) が あります。 uupaa.js version 0.6(近日中にリリース予定)では、DataURI をデコードする機能をエミュレートします。 DataURIって何 ラリーさんがRFC2397で提…
スラドに「Mozillaプロジェクト、IE向けのCanvasプラグインを開発中」なる記事があがってるのを、さっき見つけました。 http://slashdot.jp/it/article.pl?sid=08/08/21/1023205「ActiveXなプラグインを作っちゃって、IEでもHTML5::Canvasを使えるようにしよ…
uupaa.js version 0.5のリリース作業に取り掛かっていますが、ひとつ非常にこまったバグが残っていたりします。それは、Windows上のSafari3.1で発生するのですが、 <html><head><title>Safari3.1(525.13.3) createPattern is overturnd</title></head><body> <div> <img id="img" src="cover0.jpg" alt="" /> </div></body></html>
プログラマー畑で育った自分としては、デザインスキルがLv3ぐらいしかないのです。PhotoShopは使えるがイラレがだめとか。そんな悩めるコーダー出身者でも、1行コードを書くだけで、いまどきデザインなパーツを簡単に使えれば、きっともっとうれしいハズ!た…
線形グラデーション(createLinearGradient)の角度(angle)がうまく指定できない問題と戦っていました。 Safariで描画 IE + excanvas.js (v0.2) + uupaa.js (v0.5RC1) で var grad = ctx.createLinearGradient(0, 0, 80, 40); は幅80,高さ40の線形グラデーショ…
IEでもcanvasを使いたい。ちゃんとグラデーションさせたい。画像で塗りつぶしたい。色名を認識してくれない。もっと早く描画できないのか。IEでcanvasを使ってグラフィカルな描画をしたい場合の唯一の選択肢 excanvas.js を使っていると、すぐに多くの制限に…
IE用のCoverFlowを実装がてらVMLを勉強中です。今日は、excanvas.js(version 0.2)や、その根底にあるVMLの問題とその解決方法を列挙してみます。 [VML] oval stroke="false"が無視され線が描画される strokeサブエレメントを追加し、<v_:stroke on="false" …
進んでいません。ちゃんとやろうと思ったら、アフィン変換やらいままで避けて通っていた道を進む必要があるのでは〜? と気が付き、実装の手を止め、3D CGのお勉強をしてました。 そもそもJavaScriptですから、行列計算のライブラリも自前でガリガリ書かなき…
追記: uupaa-excanvas.js をリリースしました。 excanvas.js は IE で canvas 要素のエミュレートを行う Google 謹製の JavaScript ライブラリです。このライブラリは、最初のとっかかりが結構難しいです。実体験を元に、ハマリポイントを列挙してみます。 …
まずDockを実装するにあたり、既存のものがないかググってみました。 A Mac OS X-style Dock In JavaScript ソレっぽいのがいくつか見つかりましたが、これらに共通するのは、アイコン, アイコンの鏡像, まな板(ステージ)画像等をPhotoshop仕事で用意するタ…
rgba()での指定はサポートしており、 fill()やstroke()にも反映されるようですが、 画像の合成には使えないようです。
なぜIEとOperaのcanvasは自作のCoverFlowで何も表示されないのかを調べてます。 <html> <head> <title>reflect test</title> </head> <body> <img id="cover0" src="./cover0.jpg" alt="" style="display: none" /> </body></html>
uupaa.js demoで暫定版を公開しています。 現在のところFirefoxのみで軽快に動作します。何かと組み合わせると面白いものができるでしょう。きっと。
Firefox上では軽快に動作するようになりましたが、問題というか宿題が結構ありまして… Firefox以外で動作しない(Safari:描画崩壊, Opera:エラー, IE:描画すらされない) 斜め画像のジャギーが結構気になる 160x160以外の画像への対応 ライブラリ化 コードが汚…
昨日からCoverFlowを作ってます。 目指しているCoverFlowは、iPhoneやiPod touchのソレです。 Flash版があるなら、JavaScriptでも。と思いまして。見栄えはかなりそっくりになってきましたが、肝心の爽快感とかボイ〜ンボイ〜ン感が備わっていません。 毎回…
複数のcanvas使うと、こんなこともできるよ〜。という感じかな。黒いやつの中に、青いやつが入ってぐりぐり回転します。昨日のコードからの変化は、HighLightの指定,ポリゴンカラーの指定,不透明度の指定などが可能になったことぐらい。基本的に変わりません…
四角くてシフォン色のポリゴンを回転させるデモです。(お腹ぺこぺこなんで、食べられそうな色にしました) Firefox, Safari, IE用です。とあるブラウザだと謎のモノリスがぐりぐり回転します。 なぜかOperaではうまく動作させることができませんでした。canva…