Search code examples
svgstylesadobe-illustrator

SVG styling not applying in illustrator

I'm generating an SVG in a web app and allowing users to save it; the SVG embeds the styles in the header of the image.

When a user opens it in their browser (testing in Chrome) it style properly: enter image description here

However in Illustrator it seems the styles aren't being applied: enter image description here

What am I missing? Download the actual SVG here.

Solution

  • The problem is really with Illustrator's SVG importer.

    You probably have to choose between two solutions:

    1. Tell your users that saved SVGs won't work with some programs (like Illustrator)

    2. Modify your graph generating code so that it doesn't rely on CSS classes.

      For example: change the elements that use

      class="link"

      To instead set the style properties explicitly:

      fill="none" stroke="#aaa" stroke-width="2px"

    Or maybe you can find a script on the net somewhere that does that for you.