Object doesn't support property or method 'getContext' in below IE 9 versions

html, internet-explorer

Solution

You need to run your JS only when document is ready.

This may not be necessary for browsers supporting `<canvas>`, but for IE<9, `excanvas.js` works after document loaded, so you'll need to run your JS after that.

Change your JS to:

function drawTextAlongArc()
{
    /* ... */
}
function onLoad()
{
    var canvas=document.getElementById("myCanvas"),
        context=canvas.getContext("2d");
    /* ... */
}
if(window.addEventListener)
{
    window.addEventListener("load",onLoad,false);
}
else if(window.attachEvent)
{
    window.attachEvent("onload",onLoad);
}

Problem

I am using canvas element to draw curve along with text. It is working fine in chrome, Firefox, IE 9. But in IE 8,7 this is not working. Showing the error like: SCRIPT438: Object doesn't support property or method 'getContext' I searched in Google then i found `Excanvas.js` will figure out this problem, but I am getting the same error. Thank you. `<head><!--[if IE]><script src="js/excanvas.js"></script><![endif]--></head>` My html canvas code: ``` <canvas id="myCanvas" width="679" height="290"></canvas> ``` My js code: ``` function drawTextAlongArc(context, str, centerX, centerY, radius, angle) { var len = str.length, s; context.save(); context.translate(centerX, centerY); context.rotate(-1 * angle / 2); context.rotate(-1 * (angle / len) / 2); for(var n = 0; n < len; n++) { context.rotate(angle / len); context.save(); context.translate(0, -1 * radius); s = str[n]; context.fillText(s, 0, 0); context.restore(); } context.restore(); } var canvas = document.getElementById('myCanvas'), context = canvas.getContext('2d'), centerX = canvas.width / 2, centerY = canvas.height + 40, angle = Math.PI * 0.8, radius = 250; context.font = 'bold 30pt Ubuntu'; context.textAlign = 'center'; context.fillStyle = 'orange'; context.strokeStyle = '#336699'; context.lineWidth = 10; drawTextAlongArc(context, 'Sustainable Skill Solutions', centerX, centerY, radius, angle); // draw circle underneath text context.arc(centerX, centerY, radius +70, 0, 2 * Math.PI, false); context.stroke(); ```

Original source