Login to Ask a Question or Reply
You must be logged in to post your query.
Home › Forums › Report Bugs › IE9 SCRIPT438 error
IE9 SCRIPT438 error
- This topic has 7 replies, 2 voices, and was last updated 11 years, 1 month ago by
Sunil Urs.
Tagged: IE
-
September 13, 2013 at 1:21 pm #5243
I cannot get IE9 to display charts with the v1.2.1 canvasjs library.
I see the following error from the IE9 developer tools:SCRIPT438: Object doesn’t support property or method ‘getContext’
canvasjs.min.js, line 25 character 361
This relates to the following line:
this.ghostCtx=this.ghostCanvas.getContext(“2d”)
Works OK in IE10
September 13, 2013 at 1:26 pm #5245Can you please post a sample HTML + JS code that can reproduce the issue? This issue normally happens when chart is not able to get hold of the container element. Please Make sure that you creating the chart inside onload or jQuery’s $(document).ready().
September 13, 2013 at 2:04 pm #5246Hi Sunil –
Here is the code – it is auto-generated from our embedded system – I’ve tried to tidy it up a little to make it more readable:
<!DOCTYPE HTML>
<html>
<head>
<script type=”text/javascript”>
window.onload = function () {
var l1dps = [{x: 0, y: 0},];
var chart = new CanvasJS.Chart(“chartContainer0”,{
title :{
text: “Test Chart 1 ”
},
zoomEnabled: true, panEnabled: true,
axisX: {
title: “Time”,
valueFormatString: “HH:mm:ss”},
axisY: {
title: “”
},
data: [{
type: “line”,
xValueType: “dateTime”,
showInLegend: true,
legendText: “DCHANSTATS – RxBytes(TP:0)”,dataPoints : l1dps
}]
});loadCSV(“chart0.csv”);
chart.render();
function loadCSV(file) {
if (window.XMLHttpRequest) {
var request = new XMLHttpRequest();
}
else {
var request = new ActiveXObject(‘Microsoft.XMLHTTP’);
}
request.open(‘GET’, file, false);
request.send();
parseCSV(request.responseText);
}
function parseCSV(data){
var rows = data.split(“\n”);
var now = new Date();
for (var i = 0; i < rows.length; i++){
if (rows[i]) {
var column = rows[i].split(“,”);
var xVal, yVal;if (column[1]){
xVal = parseInt(column[0],16);
yVal = parseInt(column[1],16);
xVal = now-(xVal*1000);
l1dps.push({x: xVal,y: yVal,});
if (l1dps.length > 360)
{
l1dps.shift();
}
}
}
}
}
var updateChart = function(){
loadCSV(“chart0.csv”);
chart.render();
};
setInterval(function(){updateChart()},5000 );
}
</script>
<script type=”text/javascript” src=”canvasjs.min.js”></script>
</head>
<body>
<div id=”chartContainer0″ style=”height: 450px; width: 100%”>
</div>
</body>
</html>The CSV file
September 13, 2013 at 3:18 pm #5247In developer tools can you please verify that the Browser Mode is “IE9” & Document Mode is “IE9 Standards”. I could reproduce this issue when Document Mode is set to “IE8 Standards”. This happens because IE8 doesn’t support canvas element.
September 13, 2013 at 4:05 pm #5248Hi Sunil –
The browser mode is IE9
The document mode is IE9 StandardsThanks,
Paul
September 13, 2013 at 5:40 pm #5249it is auto-generated from our embedded system – I’ve tried to tidy it up a little to make it more readable:
I tried this code by creating a csv file with some dummy data and its working fine on IE9. I think something got fixed while tidying up the code. Can you please test this code on your side. In order to figure out the problem I need a single HTML file that can reproduce the bug. And which OS are you using?
September 13, 2013 at 7:00 pm #5252Hi Sunil –
This is running on Windows7 – I’ve played a little more – I can get the chart working if I open it in a separate tab – however I see the error if the chart is embedded in a frame….
<html>
<head>
<link rel=”stylesheet” type=”text/css” href=”style.css”/>
<title>V50</title>
</head>
<frameset rows=”56px,85%”>
<frame src=”header.html” noresize frameborder=”0″/>
<frameset cols=”264px,*”>
<frame src=”dmap.html” name=”map” border=”0″ noresize frameborder=”0″/>
<frame src=”chart.html” name=”menu” noresize frameborder=”0″/>
</frameset>
</frameset>
</html>chart.html:
<!DOCTYPE HTML>
<html>
<head>
<script type=”text/javascript”>
window.onload = function () {
var l1dps = [{x: 0, y: 0},];
var l2dps = [{x: 0, y: 0},];
var l3dps = [{x: 0, y: 0},];
var l4dps = [{x: 0, y: 0},];
var chart = new CanvasJS.Chart(“chartContainer0”,{
title :{
text: “Test Chart 1 ”
},
zoomEnabled: true, panEnabled: true,
axisX: {
title: “Time”,
valueFormatString: “HH:mm:ss”},
axisY: {
title: “”
},
data: [{
type: “line”,
xValueType: “dateTime”,
showInLegend: true,
legendText: “DCHANSTATS – RxBytes(TP:0)”,dataPoints : l1dps
}]
});loadCSV(“chart0.csv”);
chart.render();
function loadCSV(file) {
if (window.XMLHttpRequest) {
var request = new XMLHttpRequest();
}
else {
var request = new ActiveXObject(‘Microsoft.XMLHTTP’);
}
request.open(‘GET’, file, false);
request.send();
parseCSV(request.responseText);
}
function parseCSV(data){
var rows = data.split(“\n”);
var now = new Date();
for (var i = 0; i < rows.length; i++){
if (rows[i]) {
var column = rows[i].split(“,”);
var xVal, yVal;if (column[1]){
xVal = parseInt(column[0],16);
yVal = parseInt(column[1],16);
xVal = now-(xVal*1000);
l1dps.push({x: xVal,y: yVal,});
if (l1dps.length > 360)
{
l1dps.shift();
}
}
}
}
}
var updateChart = function(){
loadCSV(“chart0.csv”);
chart.render();
};
setInterval(function(){updateChart()},5000 );
}
</script>
<script type=”text/javascript” src=”canvasjs.min.js”></script>
</head>
<body>
<div id=”chartContainer0″ style=”height: 450px; width: 100%”>
</div>
</body>
</html>September 13, 2013 at 7:32 pm #5253Paul,
Framesets have been deprecated and are not supported in HTML5 any more. When I tried this code, IE9 automatically switched to Quirks mode (to support the same probably) and threw error. In Quirks mode Canvas is not supported probably.
In my case adding to the top of page containing frameset fixed the issue. But it is not suggested to use framesets anymore.
If required, you should instead use iframe
–
Sunil
Tagged: IE
You must be logged in to reply to this topic.