|
 SVG Charts with rounded frames in multicharts do not display in Internet Explorer |
| Posted by Osman Erdem Asga on Sep-16-2014 17:52 |
|
Hello,
I have a strange problem with multicharts and rounded corners in internet explorer when i
want to display them as true vector output. Basically i enable vector output for my charts
and they display correctly on all browsers. Then i include them in a multichart(where i
enable true vector output as well), and they disappear in internet explorer. (chrome and
firefox works with no problems). Now i discovered that charts do not display in multicharts
if i set a rounded frame larger than 0. It is alright to set rounded frame in parent
multichart, however if i set rounded frame in child charts, they disappear. Only in Internet
explorer. Would be very glad if you could help me about how to fix it. Thanks
Erdem |
| Re: SVG Charts with rounded frames in multicharts do not display in Internet Explorer |
| Posted by Osman Erdem Asga on Sep-22-2014 17:24 |
|
| is there anything i can do to get attention to this problem? |
| Re: SVG Charts with rounded frames in multicharts do not display in Internet Explorer |
| Posted by Peter Kwan on Sep-23-2014 04:24 |
|
Hi Osman,
Sorry for the late reply.
We have investigated this problem, and strongly believe it is due to a bug in IE. We have
been able to create a simple SVG by hand that can reproduce this problem. I have attached
our test case for your reference. The issue is that defining a clipPath inside a symbol tag
will cause the content to be clipped to completely disappear.
In a chart with a rounded frame, a clipPath is used to clip the chart to the rounded
rectangle. If the chart is added into a MultiChart, it becomes a "symbol" to the MultiChart,
and this triggers this IE problem.
A partially work around is not to use rounded frame, but to simply add a rounded rectangle
at the back of the chart. You can do this by using BaseChart.addText to add an empty text
box, then use Box.setSize to configure it to be the same size of the chart, and
Box.setBackground to control the fill and border colors, and Box.setRoundedCorners for the
rounded corners, and finally Box.setZOrder to put it at the background of the chart.
Note that the above is not exactly the same as a rounded frame. Although it shows a
rounded border, but it does not clip the other chart contents to the rounded frame. If there
are something in the chart that draws outside the rounded frame (that is, draw at the
corners), they will appear to overflow the frame. The most common chart object that will do
this is the a title bar with non-transparent background. You may need to design the chart
to avoid this.
Regards
Peter Kwan
|
| Re: SVG Charts with rounded frames in multicharts do not display in Internet Explorer |
| Posted by Osman Erdem Asga on Sep-24-2014 15:40 |
|
| Thank you, Peter! I hope this issue for IE will be fixed soon. |
|
Forum Home
Search
Message List
Post Message
(Peter Kwan)