IE 8 Compatibility and Requirements

A great deal of time was spent ensuring the library is compatible with IE8.

But certain steps need to be taken to activate the required checks and polyfills.

The following two lines must be present at the top of the script on your main HTML file:

<!--[if IE 8]><script type="text/javascript" src="excanvas.js"></script><![endif]-->
<!--[if IE 8]><script>var isIE8=true;</script><![endif]-->

The following two lines must be present inside your chart container:

<!--[if IE 8]><canvas id="ie8canvas" width="0" height="0" style="display:none"></canvas><![endif]--> 
<!--[if IE 8]><canvas id="ie8canvasTemp" width="0" height="0" style="display:none"></canvas><![endif]-->

Example:

    <!-- Chart -->
    <div class="chartContainer">
        <!--[if IE 8]><canvas id="ie8canvas" width="0" height="0" style="display:none"></canvas><![endif]--> 
        <!--[if IE 8]><canvas id="ie8canvasTemp" width="0" height="0" style="display:none"></canvas><![endif]--> 
      <img class="stx-loader" src="stx-loading.gif" style="display:none; z-index:100">
    </div>
    <!-- End Chart -->

Note that in order to support IE8, the document body must be fully loaded before charts are rendered . Therefore do not load the Chart inline, but instead call a loading function via body onload.

Example:

<body onLoad="displayChart()">

Once this is done, the library will properly render all charting functionality on IE 8 browsers.

Our stx-advanced.html template already has these elements included and will work on IE8 right out of the library package.