building a custom ui control with d3

16
Alicia Barnash, Blue Raster Esri Developer Summit March 9, 2015 Build a Custom UI Control with D3.js

Upload: blue-raster

Post on 16-Jul-2015

58 views

Category:

Documents


4 download

TRANSCRIPT

Page 1: Building a Custom UI control with D3

Alicia Barnash, Blue Raster

Esri Developer Summit

March 9, 2015

Build a Custom UI Control with D3.js

Page 2: Building a Custom UI control with D3

The Challenge

Page 3: Building a Custom UI control with D3

choose a solution…

Interactive SVG elements with http://d3js.org/

Page 4: Building a Custom UI control with D3

…borrowing an open source template

http://jaketrent.com/post/rotate-gauge-needle-in-d3/

Page 5: Building a Custom UI control with D3

…fork a template

Original: http://codepen.io/jaketrent/pen/eloGk/My Fork: http://codepen.io/codeleash/pen/QwBeOP

Page 6: Building a Custom UI control with D3

… customize the specs

Page 7: Building a Custom UI control with D3

… customize the specs

Page 8: Building a Custom UI control with D3

… customize the specs

Page 9: Building a Custom UI control with D3

… customize the style

Page 10: Building a Custom UI control with D3

… add interactive elements

Page 11: Building a Custom UI control with D3

…and connect to the map

Page 12: Building a Custom UI control with D3

…and connect to the map

Page 13: Building a Custom UI control with D3

…and connect to the map

Page 14: Building a Custom UI control with D3

…and connect to the map

Page 15: Building a Custom UI control with D3

…and connect to the map

Page 16: Building a Custom UI control with D3

Contact

Alicia Barnash, Blue Raster

[email protected]

@aspacebarnash

http://codepen.io/codeleash/