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

SVG Charts and Graphs With Ruby

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Starr Horne Starr Horne
March 10, 2015
Programming
390
0

SVG Charts and Graphs With Ruby

As given at Mountain West Ruby Conference 2015

Avatar for Starr Horne

Starr Horne

March 10, 2015

More Decks by Starr Horne

See All by Starr Horne
Ditching the Single Page Application - Madison+Ruby 2015
Avatar for Starr Horne snhorne
0
260
Ditching the Single Page Application (RubyNation 2015)
Avatar for Starr Horne snhorne
1
280
SVG Charts and Graphs With Ruby
Avatar for Starr Horne snhorne
0
240
The short but happy lives of TCP and HTTP requests
Avatar for Starr Horne snhorne
4
410
Machine Learning Techniques You Can Use Today
Avatar for Starr Horne snhorne
4
210
Biggish Data with Rails and Postgresql
Avatar for Starr Horne snhorne
3
980

Other Decks in Programming

See All in Programming
今さら聞けないCancellationToken
Avatar for tkym htkym
0
220
ユニットテストの先へ：テスト技法で要求・仕様を整理するJava開発実践 / Beyond_Unit_Testing_Practical_Java_Development_Techniques_for_Organizing_Requirements_and_Specifications
Avatar for SHIMANE, Yoshikazu shimashima35
0
350
Why Laravel apps break—Mastering the fundamentals to keep them maintainable
Avatar for 武田 憲太郎 kentaroutakeda
1
340
PHPで使える日時の表現と、その知り方 #frontend_phpcon_do
Avatar for hideki kinjyo o0h
PRO
0
180
運用エージェントは "作る" から "育てる" へ - 記憶と自己進化の3層設計パターン / self-evolving-agents-three-layer-agent-design
Avatar for geeawa gawa
12
3.4k
キャリア迷子上等 ─ "ない道"は自分で作ればいい
Avatar for 16bit_idol 16bitidol
2
300
Java × distroless で 軽量なコンテナイメージを / Java on Distroless
Avatar for Daisuke Garaike contour_gara
0
480
権限チェックの一貫性を型で守る TypeScript による多層防御
Avatar for aster-mnch (kitagawa) mnch
4
1.1k
Datadog × OpenTelemetry 入門と実践のあいだ
Avatar for Max Kento kn_to_maxpno
1
140
Signal Forms: Beyond the Basics @ngBaguette 2026 in Paris
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
Avatar for nrs nrslib
13
3.4k
Stage 3 Decorators でできること / できないこと / TSKaigi 2026
Avatar for Susisu susisu
1
1.5k

Featured

See All Featured
SEO in 2025: How to Prepare for the Future of Search
Avatar for Michael King ipullrank
3
3.5k
Done Done
Avatar for chrislema chrislema
186
16k
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
15k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.1k
Side Projects
Avatar for Sacha Greif sachag
455
43k
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
200
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.5k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.5k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6k
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
3k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
1
2.7k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.7k

Transcript

  1. SVG Charts & Graphics in Ruby! Starr Horne

  2. SVG Charts & Graphics in Ruby! Starr Horne

  3. StarrHorne

  4. StarrHorne 1999 The year was

  5. StarrHorne

  6. StarrHorne

  7. StarrHorne

  8. StarrHorne

  9. StarrHorne

  10. StarrHorne

  11. StarrHorne

  12. StarrHorne

  13. StarrHorne First rule of Web Design: ✨ ✨ Make the

    logo look good ✨

  14. StarrHorne

  15. StarrHorne

  16. StarrHorne

  17. StarrHorne

  18. StarrHorne

  19. StarrHorne

  20. StarrHorne

  21. StarrHorne

  22. StarrHorne How to use SVG

  23. StarrHorne

  24. StarrHorne

  25. StarrHorne Nice for caching

  26. StarrHorne Can’t style with CSS

  27. StarrHorne

  28. StarrHorne Have to use fragment caching

  29. StarrHorne Can use external CSS & JS

  30. StarrHorne Let’s Take a Tour

  31. StarrHorne

  32. StarrHorne

  33. StarrHorne

  34. StarrHorne

  35. StarrHorne

  36. StarrHorne

  37. StarrHorne

  38. StarrHorne

  39. StarrHorne SVG elements work like HTML elements

  40. StarrHorne

  41. StarrHorne

  42. StarrHorne

  43. StarrHorne

  44. StarrHorne Bar Charts

  45. StarrHorne

  46. StarrHorne

  47. StarrHorne

  48. StarrHorne

  49. StarrHorne

  50. StarrHorne Line Charts

  51. StarrHorne

  52. StarrHorne

  53. StarrHorne

  54. StarrHorne

  55. StarrHorne Do The Math

  56. StarrHorne Data -> Graph Space -> “Pixel” Space

  57. StarrHorne

  58. StarrHorne

  59. StarrHorne

  60. StarrHorne

  61. StarrHorne

  62. StarrHorne

  63. StarrHorne

  64. StarrHorne

  65. StarrHorne

  66. StarrHorne

  67. StarrHorne

  68. StarrHorne Do The (polar) Math

  69. StarrHorne

  70. StarrHorne

  71. StarrHorne A Simple Ruby Implementation https://github.com/starrhorne/svg_sparklines (if you use it,

    fork it)

  72. StarrHorne Lies I Told During This Talk • SVG text

    can be painful • Coordinate systems can be obtuse • Documentation is there, but trial and error is king (More like omissions)

  73. StarrHorne Building Web Applications in SVG …it’s good, even though

    MS published it.

  74. StarrHorne Thanks!