go-spatial / atlante

9 stars 3 forks source link

SVG partials may fail without `width="" height""` set in `<svg` #60

Open roblabs opened 5 years ago

roblabs commented 5 years ago

SVG Partials require that width="" height"" are set.

file under workaround, atlante fix may require SVG linting.

Another alternate to linting is to open the SVG Partial in Firefox and verify if the SVG data is too large. If it's too large, then add width="" height"".

Example

An SVG viewbox=0 0 200 100 but no width/height, will have weird side effects. Workaround would be to add width="200" height"100" in order for atlante to do SVG partial layouts.

roblabs commented 5 years ago

See this related example of the effect when width & height attributes are missing —

https://github.com/nationalparkservice/symbol-library/issues/142

roblabs commented 5 years ago

Process for laying out partials

  1. open raw SVG make note of the viewbox, and ensure there is a width="" height="" in the <svg tag
  2. Open the SVG in Gimp with resolution set to 72 points, so that reading off x,y coordinates are the same units as SVG.
  3. In Gimp, hover over the upper-left corner of the partial SVG, note those values and insert into the template such as this. The x,y coordinates come from Gimp.
<use x="145"  y="100"  xlink:href="assets/partial1.svg#Layer_1"
     width="145" height="100"
/>