3 ms·

What's the benefit of using a font instead of vector primitives for rendering a line chart?

• bigfudge 3y ago
  It would be an easy way to implement sparkline type charts inline. That is, you could easily mix text and sparklines without having to deal with block elements in html. I can imagine that would make it easier to have the text flow/reflow. I'm certainly going to try it.
• sublinear 3y ago
  Much simpler code and the ability to treat it like text in the browser. This is after all just a font and serializing an array of numbers into a string for this would be a one-liner function. Responsive charts can be a pain and writing CSS for text is trivial compared to fumbling through yet another ridiculous API and needing a build step.
  • throwaway143829 3y ago
    It looks like the one-liner function comes from their npm library... which requires a build step? At that point you could just use an SVG charting library. Good charting libraries will have code snippets readily available for line charts that you can copy/paste. SVG can be styled with CSS just like text. "Simpler code" seems like the main benefit but it comes with a big "weirdness" factor as the tradeoff. I'd bet there's a super lightweight SVG charting lib somewhere out there which is about as simple as this while being much more standard. i.e. supports line charts only, and has the simple type signature `(number[]) => SVGElement`.
    • dy108 3y ago
      Not just simpleness but also performance profit, since the premise is fonts are the most optimized rendering stack everywhere. Btw that one-liner function is helper, you don't have to install it it, just do `String.fromCharCode(0x100 + value)` to render character.