Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Ember D3 EmberNYC
Search
heyjin kim
June 21, 2014
Technology
1
170
Ember D3 EmberNYC
heyjin kim
June 21, 2014
Tweet
Share
More Decks by heyjin kim
See All by heyjin kim
Ember with D3 for Data Visualization
heyjinkim
0
210
Other Decks in Technology
See All in Technology
アプリをリリースできる状態に保ったまま 段階的にリファクタリングするための 戦略と戦術 / Strategies and tactics for incremental refactoring
yanzm
6
1.5k
Segment Anything Model 2
tenten0727
3
720
たった1人からはじめる【Agile Community of Practice】~ソース原理とFearless Changeを添えて~
ktc_corporate_it
1
510
開発生産性を始める前に開発チームができること / optim-improve-development-productivity.pdf
optim
0
150
言葉は感情の近似値である。その感情と言葉の誤差を最小化しよう ~コミュニケーションにおけるアナログ/デジタル変換の課題に立ち向かう~
nktamago
0
250
watsonx.ai Dojo 環境準備について
oniak3ibm
PRO
0
350
DuckDB雑紹介(1.1対応版)@DuckDB座談会
ktz
6
1.4k
DevRelの始め方
moongift
PRO
2
400
ロリポップ! for Gamersを支えるインフラ/lolipop for gamers infrastructure
takumakume
0
140
【株式会社ELYZA】|GENIAC成果報告会 自社開発モデルプレゼンテーション
elyza
1
400
Technical Writing Meetup vol.35
soracom
PRO
2
130
とあるOSSを継続可能にするための取り組みについて / OSS Refactoring Process
bun913
1
220
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
48
7.1k
Documentation Writing (for coders)
carmenintech
65
4.3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
32k
Building Your Own Lightsaber
phodgson
101
6k
Embracing the Ebb and Flow
colly
83
4.4k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.3k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
43
2k
Building a Scalable Design System with Sketch
lauravandoore
459
32k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
Adopting Sorbet at Scale
ufuk
73
8.9k
The Art of Programming - Codeland 2020
erikaheidi
48
13k
Bootstrapping a Software Product
garrettdimon
PRO
304
110k
Transcript
Ember with D3 @EmberNYC Heyjin Kim Ember Princess Engineer, SimpleReach
@heyjinkim @ember_princess
[email protected]
None
video & slide
• Ember Component • Separate Concerns • Data Bindings &
Observers • Ember Inspector • Productivity Why Ember?
http://bl.ocks.org/mbostock/3885304 D3 Code
http://bl.ocks.org/mbostock/3885304 D3 Code scales render svg data Everything is one
place! domains
http://bl.ocks.org/mbostock/3885304 D3 in Ember Separate Concerns! (MVC) d3 code data
render svg scales & domains
Examples
Reusable Charts http://jsbin.com/tinifewa/4/edit
Updating Data with Multiple Components http://jsbin.com/zeferipe/4/edit
None
• Ember Component • Separate Concerns • Data Bindings &
Observers • Ember Inspector • Productivity Why Ember?
Ember Component {{donut-chart content=content width=255 height=255}} {{donut-chart content=content_1 width=22 height=22}}
{{bar-chart content=content}} {{donut-chart content=content_2 width=22 height=22}} {{donut-chart content=content_3 width=22 height=22}} {{donut-chart content=content_4 width=22 height=22}} {{donut-chart content=content_5 width=22 height=22}}
Template ! rendering DOM Separate Concerns DATA! ! [82, 79,
143, 191] Ember Component handling DATA updating DOM ! CSS 0 50 100 150 200 April May June July D3 code scales & domains
Data Bindings & Observers
Ember Inspector
Productivity
THANK YOU! @heyjinkim @ember_princess ! http://heyjinjs.us
[email protected]