ブラウザã§ãŠçµµæãプãƒã‚°ãƒ©ãƒŸãƒ³ã‚°ï¼ Processing.js ç™»å ´ï¼ - IT戦記
ã¯ã˜ã‚㫠今日〠jQuery ã®ä½œè€…ã¨ã—ã¦æœ‰å㪠John Resig ã•ã‚“㌠Processing.js ã¨ã„ㆠJavaScript ã®ãƒ©ã‚¤ãƒ–ラリを公開ã—ã¾ã—ãŸã€‚ John Resig - Processing.js ã“ã®ãƒ©ã‚¤ãƒ–ラリを使ã†ã¨ã€æ¯”較的簡å˜ã«ä»¥ä¸‹ã®ã‚ˆã†ãªã‚°ãƒ©ãƒ•ã‚£ãƒƒã‚¯ã‚¹ã‚„アニメーションを書ãã“ã¨ãŒã§ãるよã†ã«ãªã‚Šã¾ã™ã€‚ ã¨ã„ã†ã‚ã‘ã§ã€å…¬é–‹ã•ã‚ŒãŸã°ã‹ã‚Šã®ã“ã®ãƒ©ã‚¤ãƒ–ラリを簡å˜ãªä½¿ã„æ–¹ã‹ã‚‰è©³ã—ã„使ã„æ–¹ã¾ã§ã¨ã“ã¨ã‚“掘り下ã’ã¦ã¿ãŸã„ã¨æ€ã„ã¾ã™ã€‚ Processing.js æ¦‚è¦ ã¾ãšã€ Processing.js ã¨ã¯ä½•ã‹ã¨ã„ã†è©±ã‚’ã—ã¾ã™ã€‚ Processing.js ã¨ã¯ã€ãƒ–ラウザ㧠Processing ã¨ã„ã†ãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°è¨€èªžã‚’実行ã™ã‚‹ JavaScript ã®ãƒ©ã‚¤ãƒ–ラリã§ã™ã€‚ ã§ã¯ã€ Processing ã¨ã¯ã©ã®ã‚ˆã†ãªãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°è¨€èªžãªã®ã§ã—ょã†ã‹ã€‚ Processing
JavaScriptを使ã£ã¦æç”»ã™ã‚‹Canvasã¨ã¯ï¼Ÿ
Canvasã¨ã¯ã€JavaScriptを使ã£ã¦å‹•çš„ã«å›³ã‚’æããŸã‚ã«ç–定ã•ã‚ŒãŸä»•æ§˜ã§ã™ã€‚ã“ã‚Œã¾ã§ã€å‹•çš„ã«å›³ã‚’表示ã•ã›ã‚‹æ–¹æ³•ã¨ã—ã¦ã¯ã€FlashãŒä»£è¡¨çš„ãªé¸æŠžè‚¢ã§ã—ãŸã€‚ã—ã‹ã—ã€Canvasを使ã†ã“ã¨ã§ã€ãƒ†ã‚ストエディタã•ãˆã‚ã‚Œã°ã€èª°ã§ã‚‚ç„¡æ–™ã§å‹•çš„ã«å›³ã‚’æãアプリケーションを作るã“ã¨ãŒã§ãるよã†ã«ãªã‚‹ã®ã§ã™ã€‚ 手å‰ã¿ãã§æ縮ã§ã™ãŒã€å›³1ã¯ç†è€…ãŒCanvasを使ã£ã¦ä½œã£ãŸæ£’グラフをæãJavaScriptライブラリã®ã‚ャプãƒãƒ£ç”»åƒã§ã™ã€‚Canvasを使ã†ã“ã¨ã§ã€ç°¡å˜ãªå›³ã ã‘ã§ã¯ãªãã€ã‹ãªã‚Šå‡ã£ãŸãƒ‡ã‚¶ã‚¤ãƒ³ã‚‚扱ã†ã“ã¨ãŒã§ãã‚‹ã“ã¨ãŒãŠã‚ã‹ã‚Šã„ãŸã ã‘ã‚‹ã¨æ€ã„ã¾ã™ã€‚ ã—ã‹ã—ã€Canvasã¯æ±ºã—ã¦Flashã®ä»£æ›¿æŠ€è¡“ã§ã¯ã‚ã‚Šã¾ã›ã‚“。ã¾ãšã¯ã€Canvasã®ç‰¹å¾´ã‚’ç°¡å˜ã«ã¾ã¨ã‚ã¦ã¿ã¾ã—ょã†ã€‚Canvasã®ç‰¹å¾´ã¨ã—ã¦ã¯ã€ã€ŒJavaScriptを使ã£ã¦æç”»ã™ã‚‹ã€ã€Œæ–‡å—ã¯æã‘ãªã„ã€ã€Œã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³æ©Ÿèƒ½ãŒãªã„ã€ã®3ã¤ãŒã‚ã‚Š
cvi_text_lib ブラウザã ã‘ã§æ–‡å—を好ããªæ–¹å‘ã«æ›¸ã‘るライブラリ | 秋元@サイボウズラボ・プãƒã‚°ãƒ©ãƒžãƒ¼ãƒ»ãƒ–ãƒã‚°
cvi_text_libã¯ã€Javascriptã§è‹±æ•°å—ã®æ–‡å—列をベクターæç”»ã™ã‚‹ãƒ©ã‚¤ãƒ–ラリã§ã€IEã§ã¯vmlã€ãれ以外ã®ãƒ–ラウザ(Firefox, Opera, Safari)ã§ã¯canvasを使ã„分ã‘ã‚‹ã“ã¨ã§ã€ä¸»è¦ãªãƒ–ラウザã§ã®å‹•ä½œã‚’実ç¾ã—ã¦ã„る。 Javascriptライブラリã®ä¸ã«ã€san-serifã®ãƒ•ã‚©ãƒ³ãƒˆã®ãƒ™ã‚¯ã‚¿ãƒ¼ãƒ‡ãƒ¼ã‚¿ãŒå«ã¾ã‚Œã¦ã„ã¦ã€è‹±æ•°å—・記å·ã«ã¤ã„ã¦ã¯ãã®ãƒ™ã‚¯ã‚¿ãƒ¼ãƒ‡ãƒ¼ã‚¿ã‚’å…ƒã«æ–‡å—ã‚’æã。ãã‚Œã«ã‚ˆã£ã¦ã€é€šå¸¸ã®HTMLã¨é•ã„ã€å¥½ããªè§’度ã§ãƒ†ã‚ストを表示ã—ãŸã‚Šã€ãƒ™ã‚¯ã‚¿ãƒ¼ã«æ²¿ã£ã¦æ–‡å—ã«ã„ã‚ã„ã‚ãªåŠ¹æžœã‚’与ãˆã‚‹ã“ã¨ãŒã§ãる。 サンプルã§ã‚ªãƒ³ãƒ©ã‚¤ãƒ³ã‚¨ãƒ‡ã‚£ã‚¿ã‚‚用æ„ã•ã‚Œã¦ã„る。ã“ã®ã‚¨ãƒ‡ã‚£ã‚¿ã¯ã€Javascriptã‹ã‚‰å‹•çš„ã«æ–‡å—ã‚„ãã®è¡¨ç¤ºæ–¹æ³•ã‚’切り替ãˆã‚‹ã“ã¨ãŒã§ãã‚‹ã€ã¨ã„ã†ãれ自身ã®ã‚ˆã„デモã«ãªã£ã¦ã„る。 ベクタデータを自分ã§æŒã£ã¦ã„ã‚‹ã“ã¨ã‹ã‚‰ã€æ—¥æœ¬èªžã®æ–‡å—データを全部æŒãŸã›ã‚‹ã®ã¯ãƒ•ã‚¡ã‚¤ãƒ«
1
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
Admiral
{{#tags}}- {{label}}
{{/tags}}