Charting in IE8 browser | Infragistics Forums

For example, this demonstration shows how you can attempt to load the chart using the Explorer Canvas api, which emulates the canvas element for older browsers.
You will note, though, that I have disabled the axis labels in the chart. This is because Explorer Canvas does not seem to emulate any of the text rendering API that is part of the canvas spec.
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	
	<script>
		function isCanvasSupported() {
            var canvas = document.createElement('canvas');
            return !!(canvas.getContext && canvas.getContext('2d'));
        }
		
		var oldIE = !isCanvasSupported();
	</script>	
	<!--[if IE]><script type="text/javascript" src="js/excanvas.js"></script><![endif]-->
	
	
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"></script>
	<script>
		if (oldIE) { 
			var oldHtml = jQuery.parseHTML;
			jQuery.parseHTML = function(data, context, scripts) {
				var ret = oldHtml(data,context,scripts);
				
				for (var i = 0; i < ret.length; i++) {
					if (ret[i].tagName === "canvas") {
						G_vmlCanvasManager.initElement(ret[i]);
					}
				}
				
				return ret;
			}
			CanvasRenderingContext2D.prototype.getImageData = function (sx, sy, sw, sh) {
				return {
					width: sw,
					height: sh,
					data: [0,0,0,0]
				}
			}
		}
	</script>
    <script  type="text/javascript" src="js/infragistics.loader.js"></script>
	<script  type="text/javascript" src="js/json2.js"></script>
	
    
    <script id="tooltipTemplate1" type="text/x-jquery-tmpl">
        <div id="tooltip">
            <span id="tooltipValue">Value: ${item.Value1}</span>
        </div>
    </script>

    <script id="tooltipTemplate2" type="text/x-jquery-tmpl">
        <div id="tooltip">
            <span id="tooltipValue">Value: ${item.Value2}</span>
        </div>
    </script>

    <script type="text/javascript">
		
		
		var test = isCanvasSupported();
		console.log(test);
		
        $.ig.loader({
            scriptPath: "js/",
            cssPath: "css/",
            resources: "igDataChart.Category"
        });

        $.ig.loader(function () {
			$.ig.dvCommonWidget.prototype._isCanvasSupported = function() { return true; }
            var currData, currDataSource, doGeneration;

            currData = [
				{ Label: "A", Value1: 1, Value2: 2 },
				{ Label: "B", Value1: 2, Value2: 4 },
				{ Label: "C", Value1: 3, Value2: 3 },
				{ Label: "D", Value1: 4, Value2: 4 },
				{ Label: "E", Value1: 2, Value2: 1 },
				{ Label: "F", Value1: 2, Value2: 2 },
				{ Label: "G", Value1: 3, Value2: 2 },
				{ Label: "H", Value1: 1, Value2: 3 }
			];
			
			$.support.cors = true;
			var initOptions = {
                width: "700px",
                height: "400px",
                dataSource: currData,
				axes: [{
                    name: "xAxis",
                    type: "categoryX",
                    label: "Label",
					labelVisibility: "collapsed"
                },
                {
                    name: "yAxis",
                    type: "numericY",
					labelVisibility: "collapsed"
                }],
                series: [{
                    name: "series1",
                    type: "line",
                    xAxis: "xAxis",
                    yAxis: "yAxis",
                    valueMemberPath: "Value1",
                    showTooltip: true,
                    tooltipTemplate: "tooltipTemplate1",
                    thickness: 5
                }, {
                    name: "series2",
                    type: "line",
                    xAxis: "xAxis",
                    yAxis: "yAxis",
                    valueMemberPath: "Value2",
                    showTooltip: true,
                    tooltipTemplate: "tooltipTemplate2",
                    thickness: 5
                }],
                horizontalZoomable: true,
                verticalZoomable: true,
                windowResponse: "immediate"
            }
			
			
			
            $("#chart").igDataChart(initOptions);
        });
    </script>

    <style type="text/css">
        #chart
        {
            position: relative;
            float: left;
            margin-right: 10px;
        }
        
        .selectionOptions
        {
            margin-bottom: 10px;   
        }
    </style>
</head>
<body>
    <div id="chart"></div>
</body>
</html>