Highcharts error #13 unless I run under IE compatibility view? - highcharts

Question

I am developing an asp applicaiton which uses WCF service (.svc not .asmx) to send JSON data to highcharts. It only seems to work if I use ie compatibility view. If I don't I get the message:
Microsoft JScript runtime error: Highcharts error #13: http://www.highcharts.com/errors/13
Error number 13 along with online searching suggests I don't have the proper renter to DIV, but it is present. Any ideas what I can to to make my application work in non-compatibility view?
Thanks!
As requested here is some code. I have two charts placed side by side one deals with "Low" turnover items the other with high. Here is the low item chart thus it renders to a named containerLow.
var lowchart = new Highcharts.Chart({
chart: {
renderTo: 'containerLow'
},
xAxis: {
},
plotOptions: {
series: {
cursor: 'pointer',
point: {
events: {
click: function () {
//ChartClicked(this.x, this.y, this, this.series.name, this.series.color, this.index);
ChartClicked(this, 'Low');
}
}
}
}
},
tooltip: {
formatter: function () {
var txt = "$= <b>" + this.point.x + "</b><br/>"
+ "Wait = <b>" + this.point.y + "</b><br/>"
+ "Other DB Info for future Bow Wave, etc. <b><br/>"
+ "Avg Fill Rate = <b>" + this.point.config.averageFillRate + "</b><br/>"
+ "Average On Hand = <b>" + this.point.config.averageOnHand + "</b><br/>"
+ "Average Workload = <b>" + this.point.config.averageWorkload + "</b><br/>"
return txt;
}
}
}); //end chart
My web service get a JSON string with multiple series in it. On page load I call the web service (twice once for hight and low items) and loop through the series array to plot the multiple curves.
function pageLoad() {
JSONGraphing.GetDataDB(getParameterByName("id"), 2, OnGetDataCompleteLow, OnError);
JSONGraphing.GetDataDB(getParameterByName("id"), 1, OnGetDataCompleteHigh, OnError);
}
Here is an example of one of the call back functions for the low graph.
function OnGetDataCompleteLow(result) {
var webServiceData = eval("(" + result + ")");
for (var i = 0; i < webServiceData.series.length; i++) {
lowchart.addSeries({
data: webServiceData.series[i].data
});
}
lowchart.yAxis[0].setTitle({
text: 'Wait time in Days'
});
lowchart.xAxis[0].setTitle({
text: 'Investment in Dollars'
});
lowchart.setTitle({ text: 'Low Frequency Items' });
}
I am in a bit of a time crunch any and all help greatly appreciated.

Answer 1

To make sure that the container exists you have to run your code after it gets rendered, it can be done by the following ways.
document.ready(function() {
// your code
});
or
<div id="container"> </div>
<script type="type="text/javascript"">
// your code here
</script>
or
(function() {
// your code here
})