Upgrade to Pro — share decks privately, control downloads, hide ads and more …

いまどきのSVG

Avatar for hashrock hashrock
November 18, 2013
Technology
1
270

 いまどきのSVG

そろそろ使おうSVG。LazynightでLTしたもの

Avatar for hashrock

hashrock

November 18, 2013
Tweet

More Decks by hashrock

See All by hashrock
8分でわかるVue.js
Avatar for hashrock hashrock
3
4.6k
CSS知らなかったこと
Avatar for hashrock hashrock
1
210
これだけ覚える CSS3 アニメーション
Avatar for hashrock hashrock
1
400

Other Decks in Technology

See All in Technology
Agent Development Kitで始める生成 AI エージェント実践開発
Avatar for danishi danishi
0
130
Lambda management with ecspresso and Terraform
Avatar for Michael H. Oshita ijin
2
150
VLMサービスを用いた請求書データ化検証 / SaaSxML_Session_1
Avatar for Sansan R&D sansan_randd
0
220
Oracle Cloud Infrastructure：2025年7月度サービス・アップデート
Avatar for oracle4engineer oracle4engineer
PRO
1
130
風が吹けばWHOISが使えなくなる～なぜWHOIS・RDAPはサーバー証明書のメール認証に使えなくなったのか～
Avatar for Yasuhiro Orange Morishita / 森下泰宏 orangemorishita
15
5.6k
Claude Codeは仕様駆動の夢を見ない
Avatar for Gota gotalab555
23
5.6k
相互運用可能な学修歴クレデンシャルに向けた標準技術と国際動向
Avatar for Naohiro Fujie fujie
0
210
「Roblox」の開発環境とその効率化 ～DAU9700万人超の巨大プラットフォームの開発 事始め～
Avatar for Keita Tanji keitatanji
0
120
マルチモーダル基盤モデルに基づく動画と音の解析技術
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
5
570
KubeCon + CloudNativeCon Japan 2025 Recap
Avatar for Kazuki Obata donkomura
0
190
製造業の課題解決に向けた機械学習の活用と、製造業特化LLM開発への挑戦
Avatar for knt44kw knt44kw
0
160
Claude Codeから我々が学ぶべきこと
Avatar for Oikon oikon48
10
2.8k

Featured

See All Featured
Navigating Team Friction
Avatar for Lara Hogan lara
188
15k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
179
9.9k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.2k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
507
140k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
69
4.8k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
131
19k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.9k
The Language of Interfaces
Avatar for Des Traynor destraynor
158
25k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
207
24k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
48
50k

Transcript

  1. ͍·Ͳ͖ͷSVG 13೥11݄18೔݄༵೔

  2. SVGͱ͸ • Scalable Vector Graphics • ֦େՄೳͳϕΫλάϥϑΟοΫε • 2001೥ʹW3Cඪ४ͱͳΔ •

    ௕͍͜ͱ࢖ΘΕͳ͍ࢠ(ݹ͍IE͕ରԠͤͣ) 13೥11݄18೔݄༵೔

  3. ͳ͔ͥ • ॏ͍ʢඳը͕ʣ http://codepen.io/adrianosmond/pen/LCogn • ରԠϒϥ΢βগͳ͍ • ࢓༷ʹϑϧରԠͨ͠ΤσΟλͳ͠ • ͜Ε͸ࠓ΋

    13೥11݄18೔݄༵೔

  4. 13೥11݄18೔݄༵೔

  5. ͳͥࠓSVG͔ • XML • DOM͔ΒฤूՄೳʢAJAX࢖͑Δʣ • ࣗવͱRetinaରԠ 13೥11݄18೔݄༵೔

  6. ࠓSVG͕೤͍ • Snap.svg (http://snapsvg.io/) • d3.js (http://d3js.org/) 13೥11݄18೔݄༵೔

  7. ࡞Γํ • Inkscape(Ұ୒) • खܰʹ΍ΔͳΒSVG-Edit • https://code.google.com/p/svg-edit/ 13೥11݄18೔݄༵೔

  8. ࢖͍ํ • HTMLʹ௚ຒΊࠐΈ • SVGeneration (http://svgeneration.com/) 13೥11݄18೔݄༵೔

  9. ·ͱΊ • iOS޲͚ʹ͸طʹ࢖͑Δٕज़ • ࡞Δͷ͕·ͩେม • d3Λ͸͡Ίͱͯ͠ɺ কདྷଟ༻͞ΕΔՄೳੑ͋Γ ͦΖͦΖ࢖͍࢝Ί͓ͯ͘ͱ٢ 13೥11݄18೔݄༵೔