2

I'm using Highcharts to create charts in a PHP web application. Problem is that in IE, the SVG element that is created ends up with duplicate xmlns attributes. It can be seen in the F12 developer tools, HTML tab:

enter image description here (click for larger version)

While the chart displays just fine in the browser, it causes a problem when trying to convert it to an image file with Batik, which complains about the duplicate attribute.

I've reproduced this in both IE 9 and 10, and also with the demo charts at highcharts.com (which is where the above screenshot was taken). It doesn't happen with Firefox, though.

How do I prevent the duplicate attribute? Or alternatively, what's the best way to remove it (PHP or jQuery)? I've tried running the HTML containing the SVG through Tidy, but that ends up converting elements like clipPath to lowercase, which causes problems of its own.

2 Answers 2

4

We fixed the bug now, see the the linked code at https://github.com/highslide-software/highcharts.com/issues/1978. While the element was created with createElementNS, only IE9 and IE10 actually created a visible attribute for it. So the workaround was to add the attribute as well if not present.

0
2

Looks like a bug in http://code.highcharts.com/highcharts.js

f=this.createElement("svg").attr({xmlns:sa,version:"1.1"})

seems wrong (for SVG) and should be

f=this.createElementNS(xmlns:sa, "svg").attr({version:"1.1"})

although that change might break the IE < 9 VML implementation. Perhaps you should report it to hightcharts support

1
  • It actually uses doc.createElementNS() in the background. Anyway, reported as a bug on their github tracker, thanks for the suggestion!
    – Indrek
    Jun 25, 2013 at 9:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.