A Handmade SVG Bar Chart (featuring some SVG positioning gotchas)

Let’s take a look at some things I learned about positioning elements within SVG that I discovered whilst making a (seemingly) simple bar chart earlier this week.

You don’t have much choice but to position things in SVG. SVG is a declarative graphics format, and what are graphics but positioned drawing instructions? There are plenty of gotchas and potentially frustrating situations though, so let’s get down to it.


Designing with SVG: How Scalable Vector Graphics Can Increase Visitor Engagement

I did an online seminar (organized by Shopify) in which I gave my “10 Things You Can & Should Do With SVG” talk. You can watch the video at this link. Sara Chisholm busted it out into an article that covers some of my points and embeds some of the demos.

Direct Link to ArticlePermalink


Designing with SVG: How Scalable Vector Graphics Can Increase Visitor Engagement is a post from CSS-Tricks

Source: Designing with SVG: How Scalable Vector Graphics Can Increase Visitor Engagement

1 2 3 15