SVG arrow head problems

[Greg Smith]

Save the following as a .svg file and import it (your attachments system does not accept .svg files). The file was created with InkScape. There are two problems with the arrow-heads.
1. The left-hand one is pointing the wrong way.
2. The arrow heads do not point along the lines.
I realise that this is likely a problem in the rendering engine you use, and I could export the image as a PNG, but I'd much rather use SVG and save a tedious step. I accept that it could be a problem with InkScape, but it renders correctly in Microsoft Edge...

Code: Select all

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   width="24.409187mm"
   height="3.1880188mm"
   viewBox="0 0 24.409187 3.1880188"
   version="1.1"
   id="svg5"
   inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
   sodipodi:docname="system.svg"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg">
  <sodipodi:namedview
     id="namedview7"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     inkscape:showpageshadow="2"
     inkscape:pageopacity="0.0"
     inkscape:pagecheckerboard="0"
     inkscape:deskcolor="#d1d1d1"
     inkscape:document-units="mm"
     showgrid="true"
     inkscape:zoom="2.2289141"
     inkscape:cx="362.50836"
     inkscape:cy="156.80281"
     inkscape:window-width="2759"
     inkscape:window-height="1631"
     inkscape:window-x="3938"
     inkscape:window-y="87"
     inkscape:window-maximized="0"
     inkscape:current-layer="layer1">
    <inkscape:grid
       type="xygrid"
       id="grid132" />
  </sodipodi:namedview>
  <defs
     id="defs2">
    <marker
       style="overflow:visible"
       id="Arrow2"
       refX="0"
       refY="0"
       orient="auto-start-reverse"
       inkscape:stockid="Arrow2"
       markerWidth="10.000375"
       markerHeight="7.2729998"
       viewBox="0 0 7.7 5.6"
       inkscape:isstock="true"
       inkscape:collect="always"
       preserveAspectRatio="xMidYMid">
      <path
         transform="scale(0.7)"
         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
         id="arrow2L" />
    </marker>
  </defs>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1"
     transform="translate(-38.933511,-20.355186)">
    <path
       style="fill:none;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:url(#Arrow2);marker-end:url(#Arrow2)"
       d="m 41.093871,21.346308 10.79423,-0.696152 -1.5,2.598076 10.794229,-0.696152"
       id="path1222" />
  </g>
</svg>

[Tim Green]

Hi Greg,

You didn't post an image of what it's supposed to look like, but as far as I can see it looks OK when I use it. See below. What version of Help+Manual and Windows are you running?

PS: You posted in a HM5 forum, so I've moved this to the HM9 section.

arrowsvg.png

[Alexander Halser]

I can see the marker points into the wrong direction. Our SVG library currently does not support the

Code: Select all

orient="auto-start-reverse"

option. But even when set to "auto" (this means the same as "auto-start-reverse" and should be supported by the SVG library), it does not paint the marker correctly. Automatic orientation does obviously not work with all types of markers. We have forwarded the issue to the vendor of the SVG library.

As a side note, these markers are unsupported by a lot of SVG viewers. We are monitoring 3 different SVG libraries for Delphi. Two of them paint the marker wrong, one doesn't paint the markers at all. And my Thunderbird email client, when previewing an attached SVG file, doesn't paint the markers, either. We are not alone

[Greg Smith]

Aha... the joy of thrid party libraries and the moving target of standards...
All good deeds (adding SVG capabilities) will be punished.

Keep fighting the good fight

[Simon_Dismore]

I agree, for SVG, go for the lowest common denominator (but, please allow SVG fragment references).

The auto-start-reverse seems to be SVG 2.0 per https://www.w3.org/TR/svg-markers/#MarkerElement, which also suggest auto is ambiguous.

FYI when I tried saving and loading Greg's svg, I got these results:

2023-06-04-greg-arrow-heads.png

[Greg Smith]

Just for the record, the Microsoft Edge version is as I intended, and is as displayed by InkScape (where I authored the image this is extracted from).