Doesn't seem to work with foreignObjects

[jrgleason]

I tried it on an SVG I generated with D3. All the primitives shapes seemed to come out ok but the foreign objects do not show up. Is there something I can do about this?

[exupero]

I haven't seen this problem before and a quick experiment doesn't reproduce it. Can you give an example of your SVG?

[jrgleason]

I am seeing a couple other issues too it might be a red herring I will open up issues on the other 2 side effects first then close this one if those fix it.

[jrgleason]

Here is a plunker that demos it.

The UI sucks click on the top button then on the printer if you miss the printer it is hard to tell. But if you hit it you should download the image minus the foreign objects.

[exupero]

That doesn't seem to be the right link.

[jrgleason]

WTH ok enough crazy markdown tricks then here it is in PT https://plnkr.co/edit/mCPepG4UzPJbO0ghADsr?p=info

[jrgleason]

Weird I went to edit it and the address looks correct but you are right that hyperlink is taking you the wrong spot. Make sure to copy paste the text.

[exupero]

Try adding xmlns="http://www.w3.org/1999/xhtml" to the HTML elements within the foreignObject.

[jrgleason]

Like every element or just the first on in the FO?

[jrgleason]

Looks like that works thanks now on to another issue :-)

[usmaanalii]

I'm trying to include a div with text, utilising foreign objects, but they don't show in the resulting image, should this be working?

Using Chrome 63 by the way.

[exupero]

There are a couple examples of foreignObject working on the test page, and they do seem to be working in Chrome 63. One omits the xmlns attribute, and the tests it as xml:xmlns. It's possible that contenteditable breaks rendering of the object to an image, in which case, I'll happily take a pull request that removes that attribute from the cloned SVG tree before exporting it as a PNG.

[usmaanalii]

I've tested this in browser (by manually removing contenteditable), and it's still missing the foreign object, any other ideas?

[usmaanalii]

No worries, found the fix. When you add a foreignObject, it must have a height attribute, might be worth adding to your documentation, thanks for your help.