[英]Highcharts gauges not working in IE8
I am using Highcharts gauges. 我正在使用Highcharts仪表。 Work perfectly in Chrome/Firefox/Safari -however the gauge needle does not appear in IE. 在Chrome / Firefox / Safari中完美运行 - 无论测量针是否出现在IE中。 This is echoed out in PHP. 这在PHP中得到了回应。 The "//Add some life" section of the code is all set to 0 so that the needle doesn't move. 代码的“//添加生命”部分全部设置为0,以便针不移动。
echo "<div id='gauges'><h2>Points Achievements
</h2><div id='junior' class='gauge'>
<script type='text/javascript'>
$(function () {
$('#junior').highcharts({
chart: {
type: 'gauge',
plotBackgroundColor: null,
plotBackgroundImage: null,
plotBorderWidth: 0,
plotShadow: false,
backgroundColor:'rgba(255, 255, 255, 0.1)'
},
credits: {
enabled: false
},
title: {
text: 'Junior Club Award'
},
pane: {
startAngle: -150,
endAngle: 150,
background: [{
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#FFF'],
[1, '#333']
]
},
borderWidth: 0,
outerRadius: '109%'
}, {
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#333'],
[1, '#FFF']
]
},
borderWidth: 1,
outerRadius: '107%'
}, {
// default background
}, {
backgroundColor: "; if($junior_sum >= 25){ echo "'#B1FCBC'";}else{ echo "'#DDD'"; } echo",
borderWidth: 0,
outerRadius: '101%',
innerRadius: "; if($junior_sum >= 25){ echo "'1%'";}else{ echo "'100%'"; } echo "
}]
},
// the value axis
yAxis: {
min: 0,
max: 25,
minorTickInterval: 'auto',
minorTickWidth: 1,
minorTickLength: 10,
minorTickPosition: 'inside',
minorTickColor: '#666',
tickPixelInterval: 30,
tickWidth: 2,
tickPosition: 'inside',
tickLength: 10,
tickColor: '#666',
labels: {
step: 2,
rotation: 'auto'
},
title: {
text: 'You have...'
},
plotBands: [{
from: 0,
to: " . $junior_sum .",
color: '#009FF5' // dark blue
},{
from: " . $junior_sum . " ,
to: 25,
color: '#92CFF0' // light blue
},
]
},
series: [{
name: 'Points Earned',
data: [" . $junior_sum . "],
tooltip: {
valueSuffix: ''
}
}]
},
// Add some life
function (chart) {
if (!chart.renderer.forExport) {
setInterval(function () {
var point = chart.series[0].points[0],
newVal,
inc = 0;
newVal = point.y + inc;
if (newVal < 0 || newVal > 200) {
newVal = point.y - inc;
}
point.update(newVal);
}, 3000);
}
});
});";
echo "</script></div>";
On your plotBands
section of code you have a dangling comma: 在你的plotBands
代码部分,你有一个悬空的逗号:
plotBands: [{
from: 0,
to: " . $junior_sum .",
color: '#009FF5' // dark blue
}, {
from: " . $junior_sum . ",
to: 25,
color: '#92CFF0' // light blue
}, //here is your dangling comma
]
IE does not take kindly to those. IE不善待那些人。 Since do not list your actual js with data the if
statements do not parse but I would check there also for invalid syntax. 由于不用数据列出你的实际js, if
语句不解析但我会检查那里是否有无效的语法。 If possible put up a jsFiddle of what the js looks like for the chart once it has been parsed by PHP. 如果可能的话,一旦它被PHP解析,就会为图表提供一个jsFiddle。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.