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

SVG Charts and Graphs With Ruby

Avatar for Starr Horne Starr Horne
March 10, 2015
Programming
0
370

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
260
SVG Charts and Graphs With Ruby
Avatar for Starr Horne snhorne
0
200
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
970

Other Decks in Programming

See All in Programming
社内での開発コミュニティ活動とモジュラーモノリス標準化事例のご紹介/xPalette and Introduction of Modular monolith standardization
Avatar for Mitsuharu Maruyama m4maruyama
1
130
GraphRAGの仕組みまるわかり
Avatar for とすり tosuri13
7
460
Webの外へ飛び出せ NativePHPが切り拓くPHPの未来
Avatar for Takuya Katsusa takuyakatsusa
1
200
FormFlow - Build Stunning Multistep Forms
Avatar for Yonel Ceruto González yceruto
1
190
データベースコネクションプール(DBCP)の変遷と理解
Avatar for k.fujikawa8 fujikawa8
1
270
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
Avatar for hideki kinjyo o0h
PRO
1
130
既存デザインを変更せずにタップ領域を広げる方法
Avatar for Tiphaine tahia910
1
240
Webからモバイルへ Vue.js × Capacitor 活用事例
Avatar for Naoki Haba naokihaba
0
740
GoのGenericsによるslice操作との付き合い方
Avatar for syumai syumai
2
680
Java on Azure で LangGraph！
Avatar for Kohei Saito kohei3110
0
170
Spring gRPC で始める gRPC 入門 / Introduction to gRPC with Spring gRPC
Avatar for mackey0225 mackey0225
2
520
Kotlin エンジニアへ送る：Swift 案件に参加させられる日に備えて～似てるけど色々違う Swift の仕様 / from Kotlin to Swift
Avatar for Elvis Shi lovee
1
250

Featured

See All Featured
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
46
14k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
657
60k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
790
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
26k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Put a Button on it: Removing Barriers to Going Fast.
Avatar for kastner kastner
60
3.9k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
46
9.6k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
331
22k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.3k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
86
4.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!