Android × Canvas の即死ポイントとその回避策 | buccchi.jp
CreateJS を使ったWebアプリをいくつか作ったのですが、iPhone はサクサクでも Android でやたらハマる。 Android 2.3 で最適化したつもりのものが 4.0 の標準ブラウザで落ちたりする。 機種や OS のバージョンにより動作がさまざまなため確認しきれない。 というとこでハマったポイント3つを共有します。 誰かもっとよい解決策を教えてくれるとありがたい。 即死ポイントその1 Android 4.0.4 で Canvas をリサイズするとブラウザが落ちる 回避策 Canvas 領域を広めにとっておき、Canvas ではなく Container 側をリサイズ。 はみでた部分は css でトリミング。 これで落ちなくはなるが全体的にボケる。 2013.7.7 追記 その後、以下の方法を試したところ落ちずに動作すことが確認できました。 描画とかGPUアクセラレーション
『HTML5 Web Applicationのつくりかた』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 サイバーエージェントでフロントエンドの開発をしております 原(@herablog) です。 スマートフォン版 アメーバピグ新規作成で使用した技術について触れたいと思います。 #ちなみにこの記事ではHTML5を「最新ブラウザ向けのwebアプリケーション作成技術」というかなり広い解釈で使用していますので予めご理解ください。 今までDesktop・Android向けはFlashで作成されていたのですが、今回はiOS, Androidともに対応したいということで、HTML5でできるところまでやってみることにしました。 No Lag作るにあたり
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 canvas要素とベジェ曲線の基礎を予習 | 秋葉秀樹個人ブログ
今度デジハリでセミナーがあるので、もう少し入門者ながら勉強してみたcanvas要素。 JavaScriptでベジェ曲線を描いてみました。 ポイントとなるメソッドは「bezierCurveTo()」です。 最初に「moveTo()」で開始地点を決めて、あとは「bezierCurveTo()」で終点と、あいだのハンドル（愛用イラストレータで言う）の先端の2点を指定するだけで描けるから、わりと憶えやすいかもしれません。 「bezierCurveTo()」の書式はこのようになります。（イラストレータで使う用語を織り交ぜると・・・） bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) // cp1x ... 始点から出ているハンドルの先端のX座標がはいります。 // cp1y ... 始点から出ているハンドルの先端のX座標がはいります。 // cp2x ... 終
グーグルが賭けるHTML 5の未来 － ＠IT
2009/05/28 「決してWebをあなどってはいけない」（Never underestimate the Web）。Google I/O 2009初日の基調講演でシュミットCEOに続いて登壇したのは、米グーグル バイス・プレジデントのビック・グンドトラ氏だ。ゆっくりと一語一語を区切りながら語り始めたグンドトラ氏の言葉には重みがある。彼は元マイクロソフト社員で、まさにWebをあなどっていた側にいたからだ。 グンドトラ氏はWindowsプラットフォームを唱道する立場にあった。彼に限らず、マイクロソフト社員の間には、ネイティブアプリケーションでなければできないことがあるとする見方が一般的だったという。「Keyholeという会社が出てきたとき、彼らが持つようなアプリケーションこそ、ネイティブでなければできないものだと言っていた。ところがグーグルは2004年11月にKeyholeを買収し、Goo
ブラウザでお絵描きプログラミング！ Processing.js 登場！ - IT戦記
はじめに 今日、 jQuery の作者として有名な John Resig さんが Processing.js という JavaScript のライブラリを公開しました。 John Resig - Processing.js このライブラリを使うと、比較的簡単に以下のようなグラフィックスやアニメーションを書くことができるようになります。 というわけで、公開されたばかりのこのライブラリを簡単な使い方から詳しい使い方までとことん掘り下げてみたいと思います。 Processing.js 概要 まず、 Processing.js とは何かという話をします。 Processing.js とは、ブラウザで Processing というプログラミング言語を実行する JavaScript のライブラリです。 では、 Processing とはどのようなプログラミング言語なのでしょうか。 Processing
IEでJavaScriptのCanvasを利用するためのライブラリ「ExplorerCanvas」:phpspot開発日誌
IEでJavaScriptのCanvasを利用するためのライブラリ「ExplorerCanvas」 2007年04月23日- ExplorerCanvas Firefox, Safari and Opera 9 support the canvas tag to allow 2D command-based drawing. ExplorerCanvas brings the same functionality to Internet Explorer. IEでJavaScriptのCanvasを利用するためのライブラリ「ExplorerCanvas」。 FirefoxやSafari, Opera9ではブラウザ上で図形を描画できる Canvas クラスが存在しますが、IE にはそれがありません。 その Canvas 機能を IE に追加するライブラリが公開されました。 Canvas 同様
Prototype.jsベースのグラフィックス描画フレームワーク:phpspot開発日誌
Prototype Graphic Framework This open-source framework is developed for my new project NeoMeeting. Prototype.jsベースのグラフィックス描画フレームワークの紹介。 四角形、円形、多角形などを SVG/VML/Canvas の方式で描画することが出来ます。 コードは次のようにオブジェクト指向でシンプルに記述できます。(SVG描画の場合) // Create an SVG renderer var renderer = new SVGRenderer("whiteboard"); // Create a rectangle with some attributes like color and bounds var rect = new Graphic.Rectangle(rendere
JavaScriptで図形を描くHTML要素「Canvas」の実例
JavaScriptを使ったAJAXが昨年前半まで大いに注目を集めていましたが、その根本になったJavaScript自体は古くからあり、AJAXというのは新しい応用法みたいな側面が非常に強かったのが特徴です。 しかし今回紹介する「Canvas」要素はそういうのとは明らかに一線を画しています。グラフの描画、写真合成、アニメーションなどが可能で、実際にはMac OS X のDashboardに初導入されています。そのため、サポートしているブラウザはSafariとFirefox 1.5以降のGecko1.8ベースのブラウザ、それからOpera9となります。また、この「Canvas」要素は「HTML 5」としても知られるWhatWG Web applications 1.0仕様の一部でもあるそうです。 といろいろ書いても実感がわかないと思うので、いろいろな実例を見てみましょう。 まずは簡単なフレー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://youmos.com/news/explorer_canvas.html
canvasリファレンス