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
0
390

SVG Charts and Graphs With Ruby

As given at Mountain West Ruby Conference 2015

Avatar for Starr Horne

Starr Horne

March 10, 2015
Tweet

More Decks by Starr Horne

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

Other Decks in Programming

See All in Programming
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
Avatar for nash_efp nash_efp
1
980
Lambda のコードストレージ容量に気をつけましょう
Avatar for tatsuki-yamada tattwan718
0
130
CSC307 Lecture 04
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
660
疑似コードによるプロンプト記述、どのくらい正確に実行される？
Avatar for kokuyouwind kokuyouwind
0
390
Amazon Bedrockを活用したRAGの品質管理パイプライン構築
Avatar for とすり tosuri13
5
750
AgentCoreとHuman in the Loop
Avatar for Har1101 har1101
5
240
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる！
Avatar for とすり tosuri13
1
180
カスタマーサクセス業務を変革したヘルススコアの実現と学び
Avatar for Tomoyuki Hamaguchi _hummer0724
0
710
360° Signals in Angular: Signal Forms with SignalStore & Resources @ngLondon 01/2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
130
インターン生でもAuth0で 認証基盤刷新が出来るのか
Avatar for takumi taku271
0
190
AI Schema Enrichment for your Oracle AI Database
Avatar for thatjeffsmith thatjeffsmith
0
310
AI時代の認知負荷との向き合い方
Avatar for OptFit Corp. optfit
0
160

Featured

See All Featured
Abbi's Birthday
Avatar for Violet Bock coloredviolet
1
4.8k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
359
30k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
51k
Measuring Dark Social's Impact On Conversion and Attribution
Avatar for Stephen Akadiri stephenakadiri
1
130
Leo the Paperboy
Avatar for Maya Tellez mayatellez
4
1.4k
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
2.9k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
128
17k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
54
8k
Designing for Performance
Avatar for Lara Hogan lara
610
70k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
62
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
2
190
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
Avatar for Tech SEO Connect techseoconnect
PRO
0
86

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!