我对IE 7有一些问题，以显示我由Highstock设计的图表。
当我尝试设计图表并在Chrome上看到它时，它没有任何问题。
这是我想看的图表。
http://211.47.191.60/temp/Cap_origin_from_chrome
然而，当我试图在IE 7上看到它时，它就像这样显示。
http://211.47.191.60/temp/Cap_from_IE7
这是我通过使用Fiddle设计的javascript源代码。
$(function () {
// Create the chart
window.chart = new Highcharts.StockChart({
chart: {
renderTo: 'container',
type: 'areaspline',
backgroundColor: '#FFFFFF',
shadow: true
},
credits: {
enabled: false
},
rangeSelector: {
buttons: [{
type: 'day',
count: 1,
text: '1D'
}, {
type: 'day',
count: 15,
text: '2W'
}, {
type: 'month',
count: 1,
text: '1M'
}, {
type: 'month',
count: 3,
text: '3M'
}, {
type: 'month',
count: 6,
text: '6M'
}, {
type: 'year',
count: 1,
text: '1Y'
}, {
type: 'all',
text: '전체'
}],
inputStyle: {
color: '#039'
},
labelStyle: {
color: 'silver'
},
selected: 1
},
navigator: {
enabled: false
},
xAxis: {
//categories: ['1회차', '2회차', '3회차', '4회차', '5회차', '6회차', '7회차'], // 동적으로 늘려야 함
showFirstLabel: false,
showLastLabel: true,
tickPixelInterval: 150,
tickColor: 'green',
tickLength: 10,
tickWidth: 2,
tickPosition: 'inside',
//type: 'datetime',
//dateTimeLabelFormats: {
// day: '%Y<br/>%m-%d',
// week: '%Y<br/>%m-%d',
// month: '%Y-%m',
// year: '%Y'
//},
labels: {
rotation: -30,
y: 10
}
},
yAxis: {
tickPixelInterval: 40,
tickColor: 'gray',
tickLength: 10,
tickWidth: 2,
tickPosition: 'inside',
gridLineWidth: 1,
gridLineDashStyle: 'longdash',
minorGridLineColor: '#FFF0F0',
minorGridLineWidth: 1,
minorTickInterval: 'auto',
min: 0,
max: 100,
plotLines: [{
value: 90, // DB 에서 평가 기준 받아와 저장 필요
width: 3,
color: 'red',
dashStyle: 'dash',
label: {
text: '평가기준',
align: 'top',
y: -4,
x: 12
}
}],
title: {
align: 'high',
offset: 0,
text: '종합품질점수',
rotation: 0,
y: -10
},
labels: {
formatter: function () {
return this.value + ' 점';
},
x: -30
}
},
plotOptions: {
series: {
marker: {
enabled: true
}
}
},
scrollbar: {
enabled: true,
minWidth: 5,
barBackgroundColor: 'gray',
barBorderRadius: 7,
barBorderWidth: 0,
buttonBackgroundColor: 'gray',
buttonBorderWidth: 0,
buttonArrowColor: 'yellow',
buttonBorderRadius: 7,
rifleColor: 'yellow',
trackBackgroundColor: 'white',
trackBorderWidth: 1,
trackBorderColor: 'silver',
trackBorderRadius: 7
},
series: [{
name: '종합품질점수',
data: [{
name: '1회차',
color: 'red', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("!!!!");
}
},
x: Date.UTC(2013, 0, 1),
y: 32
}, {
name: '2회차',
color: 'red', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("@@@@");
}
},
x: Date.UTC(2013, 0, 2),
y: 41
}, {
name: '3회차',
color: 'red', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("####");
}
},
x: Date.UTC(2013, 0, 3),
y: 54
}, {
name: '4회차',
color: 'red', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("$$$$");
}
},
x: Date.UTC(2013, 0, 4),
y: 67
}, {
name: '5회차',
color: 'red', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("%%%%");
}
},
x: Date.UTC(2013, 0, 5),
y: 74
}, {
name: '6회차',
color: 'blue', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("^^^^");
}
},
x: Date.UTC(2013, 0, 6),
y: 85
}, {
name: '7회차',
color: 'blue', //평가 기준 만족 시 blue, 불만족시 red
events: {
click: function () {
alert("&&&&");
}
},
x: Date.UTC(2013, 0, 7),
y: 91
}],
type: 'area',
pointStart: Date.UTC(2013, 0, 1),
pointInterval: 24 * 3600 * 1000,
showInLegend: true,
threshold: null,
tooltip: {
valueDecimals: 2
},
fillColor: {
linearGradient: {
x1: 0,
y1: 0,
x2: 1,
y2: 1
},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, 'rgba(0,0,0,0)']
]
}
}]
});
}）;
有一些韩国人的角色，请不要介意。
任何人都可以帮我解决这个问题吗？
答案 0 :(得分：1)
在Highcharts中看起来像plotLines的bug，报告：https://github.com/highslide-software/highcharts.com/issues/1478
可能的解决方法是在回调中添加plotLine，参见示例：http://jsfiddle.net/f9aTL/12/（仍然不是完美的解决方案）
回调：
function (chart) {
chart.yAxis[0].addPlotLine({
value: 90, // DB 에서 평가 기준 받아와 저장 필요
width: 3,
color: 'red',
dashStyle: 'Dash',
label: {
text: '평가기준',
align: 'top',
y: -4,
x: 12
}
});
});