AliasIO
Raphael Markers for Arrow tips Not exported
I am creating connections with arrow heads between the rectangles using graffle(http://raphaeljs.com/graffle.html) but when i try to export the svg the connections between the rectangles do appear but the arrow-heads doesn't . I have created a fiddle for your ref:- http://jsfiddle.net/nHEsE/10/ Please let me know if you want more clarifications.
Thanks
Just want to add some info, The export doesn't includes attributes marker-end-url in the path elements and this would also accompany the raphael inbuilt markers defined in raphael defs tag. Hope this helps if you are not aware of it
I think i have found the issue. It seems like the issue is with the defs tag(that contains the marker ids) of raphael are not included in exported svg and also marker-end-url attribute is not present in the path elements because of which arrow-heads are not showing. In path elements of rapahel, while export, instead of marker id another attribute is added which is "arrow-end": "classic-midium-midium". So when i added the defs tag of raphael into my generated svg and replace the arrow-end attribute with the marker-end-url attribute by giving the required value the arrow heads appeared. But now the issue is with the positioning of arrow heads. In the exported svg the x and y coordinates of horizontal and vertical arrowheads is slightly more which leads to intersection of arrows with the object(rectangles in my case) which doesn't look good.
Also adding defs tag statically and replacing the arrow-head attribute with marker-end-url by manipulating the svg string doesn't looks like a good solution.Is there any other way of doing it.?
Any help in this regard will be appreciated. I really need this.
Thanks
Sorry for not responding. I can't really help you without investigating the issue, to be honest I don't know much about the subject either. Other project take priority at the moment, I can't say for sure when I have some time to look into this. Please do let me know if you make some progress in the mean time.
I understand you can't actively work on this issue right now, but just wanted to let you know that I'm also having the same issue where the arrow heads aren't being converted to svg.
Not sure if this will help anyone or not, but I was able to get around not having arrow heads by drawing a line with a triangle on it:
var arrow = R.path('M 12.5 25 L 12.5 100 M 12.5 0 L 25 25 L 0 25 Z');
arrow.attr( { fill: 'black', stroke: 'black', 'stroke-width': '12' } );
This exports to SVG correctly. Here is a screen shot after I rendered the svg to png:
