Copy
SVG Weekly logo

This is edition 48 of SVG Weekly, a selection of interesting links to SVG tutorials, tools, experiments and talks curated by Jachin Sheehy. I also keep an eye on the wider world of data visualisation, and share compelling visualisations or projects, even if these aren't directly related to SVG.

View this email in your browser

Tutorials

Animate a gradient to imitate a flow in D3.js

Animate a gradient to imitate a flow in D3.js

Nadieh Bremer continues here SVG beyond mere shapes series with a demonstration of how to animate a gradient to give the impression of a flow in a D3 data visualisation.

Make a Responsive Animated Walk Cycle with SVG and CSS steps()

Make a Responsive Animated Walk Cycle with SVG and CSS steps()

Dudley Storey uses an SVG sprite and CSS steps() to build a cartoon figure’s walk cycle.

SVG Clipping Path Examples — Using Paths And Text

SVG Clipping Path Examples — Using Paths And Text

Steven Bradley dives into some more complex examples of clipping in SVG that use paths and text as the SVG clipping path.

Tips for Aligning Icons to Text

Tips for Aligning Icons to Text

Geoff Graham brings practical wisdom to the art of making your icon system (SVG or otherwise) play well with your typography.

The Safari Problem With SVG Sprites (Now Fixed)

The Safari Problem With SVG Sprites (Now Fixed)

Nico Brünjes started out documenting a workaround for a Safari bug that would reload SVG sprite file multiple times ... but the WebKit team has fixed the bug in the intervening time! A lovely reminder that the web is still getting better fast (and that you need to constantly reassess if your workarounds are needed anymore).

Web Image Effects Performance Showdown

Web Image Effects Performance Showdown

Una Kravets looks at all the different ways to implement a grayscale filter, and assess both the ease of implementation and performance implications of HTML canvas, SVG, CSS filters, and CSS blend modes.

Watch & Listen

SVG Beyond Mere Shapes

SVG Beyond Mere Shapes

Nadieh Bremer's talk from OpenVis Conf 2016 is available. Lots of beautiful SVG visualisations with D3. (Video - 29 minutes)

Tools

SVG Path Transformer by Anthony Dugois

SVG Path Transformer by Anthony Dugois

Transform your SVG path ... and get a new path back

Experiments

Polygon art (1 SVG) by Gregor Adams

Polygon art (1 SVG) by Gregor Adams

Penrose Tiling by Gareth Peat

Penrose Tiling by Gareth Peat

That's all for this week. Please send suggestions and links to curator@svgweekly.com or @SVGWeekly.
Copyright © 2016 SVG Weekly, All rights reserved.


unsubscribe from this list    update subscription preferences 

Email Marketing Powered by MailChimp