Canvasとcanvasライブラリ
Upcoming SlideShare
Loading in...5
×
 

Canvasとcanvasライブラリ

on

  • 902 views

 

Statistics

Views

Total Views
902
Views on SlideShare
902
Embed Views
0

Actions

Likes
1
Downloads
3
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Canvasとcanvasライブラリ Canvasとcanvasライブラリ Presentation Transcript

    • CanvasとCanvasライブラリ 株式会社バイタリフィ 2013/07/31
    • 目次 1.Canvasについて - Canvasについて - メリット/デメリット - Canvasの使いどころ 2.CanvasのJavascriptライブラリ紹介 - CreateJS - enchant.js - jCanvas - tmlib.js
    • 1.Canvasについて
    • Canvasについて Canvasとはブラウザ上に図を描くために策定され た仕様で、GIF/JPEG/PNGといったフォーマッ トの画像を使用することなく、図を表現することが 可能です。 またアニメーションやインタラクティブなコンテン ツをFlashやJavaのようなプラグインを使用せず、 Javascriptベースで表現することが可能です。
    • Canvasについて ■対応ブラウザ状況 Internet Explorer 9 以降 Firefox Chrome Safari Opera
    • Canvasについて Internet Explorer 6∼8については、 ExplorerCanvas というJavascriptライブラリ で再現可能です。 ただし完全には再現できないのとネイティブでの Canvas表示よりも処理が重くなります。
    • メリット/デメリット ■メリット ・FlashやJavaなどのプラグインを使用しなくて もリッチなコンテンツの制作が可能 ・htmlとJavascriptで制作できるので、特別な オーサリングツールを必要としない ・iOSでも使用できる(クロスプラットフォーム)
    • メリット/デメリット ■デメリット ・IE8以下非対応(ExplorerCanvasである程度 は対応可能) ・Flashよりも描画が遅い・重い ・Flashよりも開発に工数がかかる ・埋め込みフォントが使用できない(Webフォント の使用である程度は対応可能)
    • Canvasの使いどころ スマートフォンサイト → Canvas PCサイト → Flash or Canvas スマートフォンサイトの場合、iOSの制限があるため Canvasしか選択肢はないです。 PCサイトの場合は現状では無理にCanvasを使用する必要 はないように思えます。ただしiPad対応など含まれる場合は、 Canvasを選択する必要が出てくると思います。
    • 2.Canvasの Javascriptライブラリ紹介
    • Canvasの制作を楽にしてくれる Javascriptライブラリの一部を紹介します。
    • CreateJS インタラクティブコンテンツのためのHTML5ライ ブラリになります。Flashに近いAPIになっており、 Flash制作者が導入しやすいライブラリになります。 またAdobeからToolkit for CreateJSという Flash用のプラグインが提供されており、Flashか らCreateJSを使用したhtml/Javascriptへの書 き出しを容易に行うことが可能です。
    • enchant.js スマートフォンでCanvasを使用したゲームやアプ リ開発に注力したライブラリになります。 2011年と早い段階から公開されており、すでに多 くのゲームやアプリが制作されています。
    • jCanvas CanvasをjQueryから簡単に扱えるようにするプ ラグインになります。 jQueryと同じような記法でCanvasを扱うことが できます。 $("canvas.test").drawArc({ fillStyle: "black", x: 100, y: 100 });
    • tmlib.js 「Javascriptをより使いやすく、より便利に、そ してより豊かに」をモットーに個人の方が制作して いるJavascriptライブラリになります。 個人的には今一番注目しているライブラリです。
    • バイタリフィについて
    • 会社概要・連絡先 会社名:株式会社バイタリフィ 本社所在地 :〒150-0021 東京都渋谷区恵比寿西1-9-6 アストゥルビル8F TEL : 03-5428-6346 FAX : 03-3461-6347 WEB : http://vitalify.jp/ 設立 : 2005年9月21日 資本金 : 5000万円 グループ従業員数 : 200名(2013年1月実績) 代表取締役 : 川勝 潤治