Jump to content

Recommended Posts

Posted

Being a web designer and developer I’m frequently dealing with SVGs. Lately I had some graphs/charts and made a few observations I’m curious about:

 

AD seems to put each object in a group and apply matrix transformations in order to position the groups, additionally to the standard x and y positions of the elements (text or path). What is the point of that, or the reason behind it? Additionally, this seems to be kind of random because I created a layer and put some text and a shape inside, and there there’s no matrix transformation.

 

I like how AD can deal with the <use> element when it opens a manually created SVG. But it creates physical copies of the elements/objects and upon re-exporting, the <use> elements are gone; perhaps this can be improved in future when symbols/global objects are implemented where there are just different instances of the same object?

 

It appears that it can’t handle embedded fonts. I had an SVG where I manually embedded a base64 encoded font using @font-face in a <style> element. This works nicely when viewed in a web browser but AD discards that font declaration and resorts to default Arial. Or actually, it chokes on style declarations with fallback fonts (e. g.: font-family: Myfont, Arial, Helvetica, Sans-serif;) when it should resort to the standard way of handling this, i. e. use the first declared font, and if that isn’t existing, use the next one, etc.

 

Oh, and one other thing: What does the “flatten transforms” checkbox in the export dialog actually do? Is that for gradients and stuff? And what is “use tile patterns”?

Posted

OK, I discovered that the matrix transforms are only applied to (AD) groups not to layers, and they are applied to multi-line framed text (which is broken into multiple <text> elements inside a group). The last one is of particular interest for me: Why isn’t multi-line text in a single framed text object converted to a single <text> element with <tspan>s for the lines? This way one could also use relative measurements (the dy attribute in SVG) for the line spacing. And in the export dialog there is a checkbox named “longer text spans” – what does that actually do?

Also, the text-anchor SVG attribute could be used to align text left/middle/right in relation to its x-position, according to the alignment setting in AD.

 

Why is there a difference between AD groups and layers in the resulting SVG? In SVG there are only groups (<g> element), and both, groups and layers are converted to SVG groups anyway, except that AD groups have a matrix transform while layers don’t.

Posted

Tile patterns are described here. Using them generally produces smaller and better quality files, but some apps don't understand them.

 

If Flatten transforms is not checked, we attempt to preserve more of the document's group structure so that objects are described in the coordinate system of their container. If it is checked, we generally output fewer groups and transforms; for example, we transform the curve data itself before outputting it. Transforms have to be output for rotated text and bitmaps regardless.

 

If Longer text spans is unchecked, then we try to reproduce the position of each character of text exactly, even if this means adding many tspans. If it is checked, we produce fewer tspans, but the text won't be positioned as exactly. That each line becomes a separate text element is an idiosyncrasy of how our export is implemented.

 

Our SVG import is still fairly basic. Embedded fonts and fallback fonts are not yet implemented. Nor do we do tile patterns.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.