5 ms·
I disagree, I routinely manually mess with SVG (even SVG generated with a program like inkscape) because it lets me add interactivity and animations. That's the
by simias 6y ago
I disagree, I routinely manually mess with SVG (even SVG generated with a program like inkscape) because it lets me add interactivity and animations. That's the killer feature for me: you can draw arbitrary vector shapes in a website, then hook into them using javascript the way you would any DOM element. There are a few subtleties to make it work well, but it's pretty straightforward.
Here's an example: https://svkt.org/~simias/up/20210212-185105_svg.png https://svkt.org/~simias/up/20210212-185105_svg.png
All the elements and paths are SVG generated from some javascript. You can interact with the various elements, move them around and the paths are updated in real time.
Of course you could do the same thing with a raster format by using a canvas and drawing a bitmap for instance, but SVG works at a higher level and lets you do these things a lot faster and probably with better performance. You can use CSS-styling, you can register javascript event callbacks etc...
Or to put it another way: if SVG was meant as an opaque machine-to-machine format, why even bother with the insane overhead of XML instead of using some dense binary format?
- runarberg 6y agoGetting your hands dirty by manually messing with SVG elements allows you so much freedom while plotting in D3, it is amazing. If you do any sort of advanced data visualization on the web, being able to read and write parts of SVGs is essential.
- follower 6y agoAlong those lines, I recently encountered this project that enables the use of SVG to design maps etc for games developed with the Rust language game engine Bevy: https://github.com/carrascomj/bevy_svg_map https://github.com/carrascomj/bevy_svg_map "The properties of the lines (color, opacity, fill...) can be used to programmatically add functionality..."