Markers inconsistency

Discuss SVG code, accessible via the XML Editor.
bryonak
Posts: 2
Joined: Sat Jan 16, 2010 11:31 am

Markers inconsistency

Postby bryonak » Sat Jan 16, 2010 11:52 am

SOLVED: second post



Software: Inkscape 0.47 on Ubuntu 9.10 64bit (the standard repository version).

While hand-crafting a SVG image and trying to achieve "fading" lines with gradients, I've discovered that Inkscape and eog (the standard Gnome viewer) render my markers very differently.
Firefox, gthumb, Epiphany and Midori all render the same way as eog, which means Inkscape might be stepping out of line.

Here's the SVG:

Code: Select all

<?xml version='1.0' encoding='UTF-8' standalone='no'?>

<svg
  xmlns='http://www.w3.org/2000/svg'
  xmlns:svg='http://www.w3.org/2000/svg'
  xmlns:xlink='http://www.w3.org/1999/xlink'
  xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape'
  version='1.2'
  width='150'
  height='100'
>

<defs>

  <linearGradient id='fadeout' x1='0' y1='0' x2='1' y2='0'>
    <stop stop-color='#00f' offset='0' style='stop-opacity:1;' />
    <stop stop-color='#00f' offset='1' style='stop-opacity:0;' />
  </linearGradient>

  <marker id='fadeline1' markerWidth='3' markerHeight='1' refY='0.5'>
    <line x1='0' y1='0' x2='5' y2='0' stroke='url(#fadeout)' stroke-width='3'/>
  </marker>

  <marker id='fadeline2' markerWidth='3' markerHeight='1'>
    <line x1='0' y1='0' x2='5' y2='0' stroke='url(#fadeout)' stroke-width='3'/>
  </marker>

  <marker id='fadeline3' markerWidth='3' markerHeight='1'>
    <line x1='0' y1='0' x2='5' y2='0' stroke='url(#fadeout)' stroke-width='1'/>
  </marker>

</defs>

<g inkscape:label='line' inkscape:groupmode='layer' id='layer_fadeline' >
  <path d='M 10 30 L 100 30' style='stroke:#00f;fill:none;stroke-width:3;' marker-end='url(#fadeline1)' />
  <path d='M 10 50 L 100 50' style='stroke:#00f;fill:none;stroke-width:3;' marker-end='url(#fadeline2)' />
  <path d='M 10 70 L 100 70' style='stroke:#00f;fill:none;stroke-width:3;' marker-end='url(#fadeline3)' />
</g>

</svg>


This renders with eog:
Image
and with Inkscape:
Image

The first line in the eog image and the last line in the Inkscape image show the desired behaviour.
Any ideas as how to "unify" the behaviour? I'd very much like to be able to edit the file with Inkscape, but OTOH prefer to stay with the majority of renderers.
Last edited by bryonak on Sun Jan 17, 2010 4:08 am, edited 1 time in total.

bryonak
Posts: 2
Joined: Sat Jan 16, 2010 11:31 am

Re: Markers inconsistency

Postby bryonak » Sun Jan 17, 2010 4:07 am

SOLVED

eog renders the marker incorrectly. Adding style="overflow:visible" to the marker's opening tag solves this.

Additionally, if you want the above example to render correctly in Batik, add gradientUnits to the gradient opening tag:
gradientUnits="userSpaceOnUse"


Return to “SVG / XML Code”