Welcome to yEd Q&A!
Here you can ask questions and receive answers from other members of the community and yEd developers. And you can tell us your most wanted feature requests.

element links: svg export with xlink target attribut set

0 votes
Hello,

I use links on graph elements and export the graphs to svg for embedding in html.

Links in svg only work if svg is embedded into an object tag. But then a click on the element with url attribut only reloads the object frame with new content. To reload the whole page one has to set the target attribut of the referencing xlink tag to "_parent".

Is it possible to configure the svg export to do so by default?

Thanks in advance.

Regards

Steffen
asked Aug 7, 2018 in Help by anonymous

1 Answer

0 votes

Unfortunately, yEd's SVG export does not allow for customizing how URLs are exported.

However, the links work for me even if the SVG document is not embedded in <object> tags. My test file was

<html>
<head>
<title>Test</title>
</head>
<body>
<p>Foo bar baz</p>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" width="34" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" height="34" font-family="'Dialog'" font-style="normal" stroke-linejoin="miter" font-size="12px" stroke-dashoffset="0" image-rendering="auto">
  <!--Generated by ySVG 2.5-->
  <defs id="genericDefs"/>
  <g>
    <defs id="defs1">
      <clipPath clipPathUnits="userSpaceOnUse" id="clipPath1">
        <path d="M0 0 L34 0 L34 34 L0 34 L0 0 Z"/>
      </clipPath>
      <clipPath clipPathUnits="userSpaceOnUse" id="clipPath2">
        <path d="M422 149 L456 149 L456 183 L422 183 L422 149 Z"/>
      </clipPath>
    </defs>
    <g id="y.node.0">
      <a target="_blank" xlink:type="simple" xlink:href="https://www.yworks.com/" xlink:show="new">
        <g fill="rgb(255,204,0)" text-rendering="geometricPrecision" shape-rendering="geometricPrecision" transform="matrix(1,0,0,1,-422,-149)" stroke="rgb(255,204,0)">
          <rect x="424" width="30" height="30" y="151" clip-path="url(#clipPath2)" stroke="none"/>
        </g>
        <g text-rendering="geometricPrecision" stroke-miterlimit="1.45" shape-rendering="geometricPrecision" transform="matrix(1,0,0,1,-422,-149)" stroke-linecap="butt">
          <rect fill="none" x="424" width="30" height="30" y="151" clip-path="url(#clipPath2)"/>
        </g>
        <g>
          <g text-rendering="geometricPrecision" stroke-miterlimit="1.45" shape-rendering="geometricPrecision" font-family="sans-serif" transform="matrix(1,0,0,1,-422,-149)" stroke-linecap="butt">
            <text x="435.1826" xml:space="preserve" y="170.1543" clip-path="url(#clipPath2)" stroke="none">1</text>
          </g>
        </g>
      </a>
    </g>
  </g>
</svg>
</body>
</html>

and I tested in Chrome 68.0.3440.84 and Firefox 61.0.1 on Ubuntu 16.04.

answered Aug 7, 2018 by thomas.behr [yWorks] (121,900 points)
Imprint | Privacy Policy