HTML controls overlapping with fusioncharts graph in IE 11

[Ashwini Maddala]

My application has some JQuery controls which seem to be overlapping with the Fusion charts graph. I tried setting z-index,setTransparent to true, WMode to transparent. None of them seem to work in IE 11 browser. This doesnt show issue in any other browsers. Any idea how to fix this for fusion charts v3 and IE 11 combination ? I attached the screenshot for more info. 

[Nabajeet]

Hi,

 

Can you please upgrade to the latest version of FusionCharts and let us know if the problem is resolved.

 

You can download the trial version here:
http://www.fusioncharts.com/download/

 

Thanks

[Ashwini Maddala]

Hi,

 

Can you please upgrade to the latest version of FusionCharts and let us know if the problem is resolved.

 

You can download the trial version here:

http://www.fusioncharts.com/download/

 

Thanks

Hi,

We cannot upgrade to latest version as per my organization standards. Is there any workaround for this version ? 

[Nabajeet]

Hi,

 

Can you share a live URL or sample.

 

Also a reason for suggesting up-gradation to you is that dependency on jQuery files has bene removed from the latest files.

 

Thanks.

[Ashwini Maddala]

hi, the reason why i cannot upgrade to next version is that fusion charts 3 is used in an organization level and it can be upgraded only when the whole company upgrades. We are rolling out to IE 11 and hence i need to be sure this works. Do you know if we have a solution or it cant be done with this version of fusion charts? 

 

 

Below is the code sample i am using. 

This is my html : 

 

<script src="../JS/jquery.ui.datepicker.js" type="text/javascript"></script>

 <script src="../../jquery/jquery-1.8.3.js" type="text/javascript"></script>

    <script src="../../FusionCharts/FusionCharts.js" type="text/javascript"></script>

    <script src="../../FusionCharts/FusionChartsExportComponent.js" type="text/javascript"></script>

    <script type="text/javascript">

 

        function CallSuccess(res) {

            var str = res.toString().split(",");

            Maxdate = str[0];

            defaultDate = str[1];

            MinDate = str[2];

            var txtFrom = document.getElementById('<%=txtFrom.ClientID%>');

            var txtTo = document.getElementById('<%=txtTo.ClientID%>');

            $(function () {

 

                $('#<%=txtFrom.ClientID%>').datepicker({

                    showOn: "button",

                    buttonImage: "../blitzer/images/calendar.gif",

                    buttonImageOnly: true,

                    changeMonth: true,

                    changeYear: true,

                    dateFormat: 'ddMyy',

                    maxDate: new Date(Maxdate),

                    minDate: new Date(MinDate),

                    defaultDate: new Date(defaultDate),

                    setDate: new Date(defaultDate),

                    buttonText: "Click to view Calender",

                    onClose: function (dateText, inst) {

 

 

                    }

                });

}</script>

 

In my rendering, 

 

strChart = InfoSoftGlobal.FusionCharts.RenderChartHTML("../../FusionCharts/MSLine.swf", "", strXml, "Chrt", "100%", "250", false);

 

            strChart = strChart.Replace("<param name=\"allowScriptAccess\" value=\"always\" />\r\n", "<param name=\"allowScriptAccess\" value=\"always\" />\r\n<param name=\"WMode\" value=\"Transparent\" />\r\n");

       

Edited March 10, 2015 by Ashwini Maddala

[Sanjukta]

 

hi, the reason why i cannot upgrade to next version is that fusion charts 3 is used in an organization level and it can be upgraded only when the whole company upgrades. We are rolling out to IE 11 and hence i need to be sure this works. Do you know if we have a solution or it cant be done with this version of fusion charts? 

 

 

Below is the code sample i am using. 

This is my html : 

 

<script src="../JS/jquery.ui.datepicker.js" type="text/javascript"></script>

 <script src="../../jquery/jquery-1.8.3.js" type="text/javascript"></script>

    <script src="../../FusionCharts/FusionCharts.js" type="text/javascript"></script>

    <script src="../../FusionCharts/FusionChartsExportComponent.js" type="text/javascript"></script>

    <script type="text/javascript">

 

        function CallSuccess(res) {

            var str = res.toString().split(",");

            Maxdate = str[0];

            defaultDate = str[1];

            MinDate = str[2];

            var txtFrom = document.getElementById('<%=txtFrom.ClientID%>');

            var txtTo = document.getElementById('<%=txtTo.ClientID%>');

            $(function () {

 

                $('#<%=txtFrom.ClientID%>').datepicker({

                    showOn: "button",

                    buttonImage: "../blitzer/images/calendar.gif",

                    buttonImageOnly: true,

                    changeMonth: true,

                    changeYear: true,

                    dateFormat: 'ddMyy',

                    maxDate: new Date(Maxdate),

                    minDate: new Date(MinDate),

                    defaultDate: new Date(defaultDate),

                    setDate: new Date(defaultDate),

                    buttonText: "Click to view Calender",

                    onClose: function (dateText, inst) {

 

 

                    }

                });

}</script>

 

In my rendering, 

 

strChart = InfoSoftGlobal.FusionCharts.RenderChartHTML("../../FusionCharts/MSLine.swf", "", strXml, "Chrt", "100%", "250", false);

 

            strChart = strChart.Replace("<param name=\"allowScriptAccess\" value=\"always\" />\r\n", "<param name=\"allowScriptAccess\" value=\"always\" />\r\n<param name=\"WMode\" value=\"Transparent\" />\r\n");

       

 

Hi,

 

Please note that you are using a much older version that support RenderChartHTML method and SWF files.

 

We neither support this method or Flash charts anymore in the latest version. Hence, we would first recommend you to upgrade to the latest version as older versions are not supported annymore.

Ref.- http://www.fusioncharts.com/asp-net-charts/

 

Looking forward to your response.