Display

SVG content is known for its high-quality, resolution-independent display, but it nonetheless has some issues that can easily be resolved with some foresight on the developer's part. Issues such as poor object opacity performance, anti-aliasing, and inconsistent document edges can be rectified with the following tips.

The opacity style property is incredibly useful to fade items in and out in SVG. However, viewer display performance may suffer, rendering clumsily if you are fading a large quantity of objects.

To improve this handling, try using both the fill-opacity and stroke-opacity descriptors for each object rather than a global opacity property. For some reason, the Adobe SVG Viewer is able to render such transparency calculations ...

Get Sams Teach Yourself SVG in 24 Hours now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.