この記事は、JavaScript で Flash Player の実現を頑張った（もしくは現在進行系で頑張っている）人たちの集う Flash Advent Calendar 2020 に参加しております。 HTML5 の Canvas はかなりの機能を有しております。Flash Player の実装にあたってこれらの豊富な Canvas の機能は大変有用なのですが、そんな中でも globalCompositeOperation というマイナー機能の活用方法は、今の時代でも十分に応用が効く知識です。Flash 終了への手向けとして、ここにその機能の素晴らしさと有効利用の方法を改めて紹介致します。 HTML5 (canvas) の globalCompositeOperation とは 一言で言うと、globalCompositeOperation は Composite すなわち合成方法の指
2. 2 Broadtail Confidential Confidential2 • このスライドは、 Chrome+HTML5 Developers Live Japan #5 にて使用予定のスライドです。 • 以下のURLからライブの様子をご覧いただけます – https://plus.google.com/events/cmmlimc40bamuk1la1qjgk2unh8 – ライブコーディング等を予定しておりますので、是非実際 の映像と共にお楽しみいただければと思います。 ネットでこのスライドを見ている方へ 3. 3 Broadtail Confidential Confidential3 • 紀平 拓男（きひら たくお） – 株式会社ディー・エヌ・エー – @tkihira – DeNAにおいてHTML5の総括を担う • 会社を2つ設立したシリアルアントレプレナー • HTM
次世代HTML標準「HTML 5」とは？ 現在、XHTML 1.0がWeb制作の現場では当たり前のように使われていますが、HTML 4.01の次バージョンにあたる「HTML 5」という規格が次のHTML標準となりそうです。 HTMLからXHTMLの進化によって属性値をクオートで囲むとか、空タグもきちんとスラッシュで閉じるといったXHTMLコーディングのお約束が、Web制作者側に当然のように強いられてきました。こういった厳密なコーディングを必要とするXHTMLは、HTMLのような良い意味でのシンプルさが無かったため、結果的に爆発的な普及にはいたりませんでした。 現場のWeb制作者たちが集まって発足された非公式な団体「WHAT WG」が2004年6月に発足されました。WHAT WGは独自に「HTML 5」の仕様策定をスタートさせ、その3年後となる2007年5月に標準化団体であるW3C内にて標準
Videos Watch and learn from our engineers as they show how to bring the latest web technologies to your websites on Safari. Watch Safari and Web Videos Forums Ask questions and discuss a variety of web development topics with Apple engineers and other developers. Apple Developer Forums Safari Extensions Safari extensions are a powerful way to add new features to Safari. They are built in Xcode wit
原文(投稿日：2010/07/01)へのリンク noVNC は、VNCクライアントで、 HTML5 WebSockets, Canvas そして JavaScriptを使って実装されている。InfoQ、は、 Joel Martin氏と、 noVNCと HTML5アプリケーションの開発経験について、少しばかり、Q&Aを持った: InfoQ: Joelさん、noVNCのアーキテクチャの全体像と様々なコンポーネントがどのように、いっしょになっているのか，教えてください。 Joel: noVNCのアーキテクチャは、６つの主要なコンポーネントからできています: コアの VNC/RFB実装: このコンポーネントは、すべてのRFBプロトコルの情報をカプセル化していて、他のすべてを動かす、主要なステートマシンです。 Canvas抽象層: このコンポーネントは、 HTML5 CanvasAPIを抽象化した層
OSSプロジェクトのホスティングサイト「GitHub.com」では、Flashで実装されていた一部のUIをCanvasに移行したという HTML5のCanvasとFlashの最大の違いは、アニメーションなどを行うために利用できる抽象レベルだ――。こう指摘するのは、Gitベースのコードホスティングサービス「GitHub.com」の共同創業者、Tom Preston-Werner氏だ（ちなみにWerner氏はマイクロソフトに買収された検索ベンチャー「Powerset」の元社員で、買収直後に“サラリー以外に3年間で30万ドル（約2770万円）”というおいしいオファーを断ってまでGitHub.comのフルタイム開発の道を選んだことでも知られている）。 Flashで書かれた一部のUIを全面的にCanvasで書き直した経験からWerner氏は、Canvasにはまだ抽象度の高いフレーワムワークが欠けてい
アドビ、FlashをHTML5のCanvasへ変換するプロトタイプ機能を明らかに。アニメーションも変換 アドビシステムズは3月10日に始めた新しいブログ「Design and Web」の中で、FlashをHTML5のCanvas要素で置き換える「Smart Paste」のデモ動画を公開しました。この機能は現在開発中のDreamweaver CS5のプロトタイプ機能とのことです。 （追記3/18：上記ブログの1つ目のエントリ「Design & Web」に、紹介する機能は「It won't be in the next version of CS.」であるとの記述がありましたので、「Dreamweaver CS5」の部分を削除させていただきます。すいませんでした）。 FlashのファイルをJavaScriptでレンダリング、Canvasへ描画 11日付けで公開されたエントリ「Canvas fo
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. Robust Session Storage in Phoenix Live View SessionsPersistently storing session info in Phoenix Live View to it survives reloads and live navigation Building the Perfect Logo StripCreate a visually balanced logo strip by adjusting logo height
きっかけ canvasタグ上に描いた絵を保存しようとしたら、 意外に情報が見つからず苦労したんで、載せときます。 canvas? まず、canvasやHTML5についての仕様は、以下のサイトを見てください http://www.html5.jp/ 流れ 今回は、フリーハンドで描いた絵を保存します。 canvasタグを用意 お絵かき 画像情報をサーバに送り、DBに保存 DBから画像情報を取り出し表示 (ﾟДﾟ)ｳﾏｰ なお、DB関係の記述は省略します。 canvasタグを用意 <html> <head> <script src="js/prototype.js" type="text/javascript"></script> <script src="js/canvas.js" type="text/javascript"></script> <style type="text/css">
以下の関数は、canvas 内にある r、g、b で指定した RGB 色を持つピクセルの数を返します。これは こちらのブログ記事 で説明しているように、例えばある領域と、その上にユーザーが描いた領域を比較するときにとても役に立ちます。 function getpixelamount(canvas, r, g, b) { var cx = canvas.getContext('2d'); var pixels = cx.getImageData(0, 0, canvas.width, canvas.height); var all = pixels.data.length; var amount = 0; for (i = 0; i < all; i += 4) { if (pixels.data[i] === r && pixels.data[i + 1] === g && pixels.
Some hobby projects, apps, demos and visualisations I've made over the years. 2023 Weekle 2018 New YouTube Channel - Speedrun Champions 2016 CraftyBall Upcoming Space Game 2010 Pocket Odds 2006 Torus Spirograph Honeycomb Snake Pipe Panic Ninja Maze Functions 3D Colour Picker 2005 Canvascape "3D Walker"
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
