这是使用Highcharts的子弹样式表。
当我将它复制到Dreamweaver时,我不能让它为我的生活工作。当我在浏览器中加载时,我得到一个空白页面。其他Highchart图表加载正常。
任何帮助?
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">
.body {
font-family:helvetica, sans-serif;
font-size:.7em;
}
.p {
margin:.5em 1em;
}
</style>
<script type+"text/javascript">
Highcharts.Renderer.prototype.symbols.line = function (x, y, width, height) {
return ['M', x, y + width / 2, 'L', x + height, y + width / 2];
};
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'bar',
borderWidth: 0,
borderColor: '#eee',
margin: [0, 0, 20, 100]
},
credits: {
enabled: false
},
exporting: {
enabled: false
},
title: {
text: ''
},
legend: {
enabled: false
},
xAxis: {
tickLength: 0,
tickColor: '#eee',
gridLineWidth: 0,
gridLineColor: '#eee',
labels: {
style: {
fontWeight: 'bold'
}
},
lineColor: '#eee',
lineWidth: 0,
categories: ['Measure 1', 'Measure 2', 'Measure 3', 'Measure 4', 'Measure 5']
},
yAxis: {
tickInterval: 2,
allowDecimals: false,
tickColor: '#ccc',
tickWidth: 0,
tickLength: 3,
lineColor: '#eee',
lineWidth: 0,
gridLineWidth: 0,
gridLineColor: 'rgba(255,255,255,.15)',
endOnTick: true,
title: {
text: ''
},
//gridZIndex:4,
min: -0.5,
max: 11.75,
endOnTick: false,
startOnTick: false,
plotLines: [{
value: 10.5,
width: 0,
color: '#eee'
}],
labels: {
y: 10,
style: {
fontSize: '10px'
},
formatter: function () {
if (this.value) {
return '$' + this.value + 'M';
} else {
return this.value;
}
}
}
},
tooltip: {
enabled: true,
backgroundColor: 'rgba(255, 255, 255, .85)',
borderWidth: 0,
shadow: true,
style: {
fontSize: '10px',
padding: 2
},
formatter: function () {
return this.series.name + ": <strong>" + "$" + Highcharts.numberFormat(this.y, 2) + "M" + "</strong>";
}
},
plotOptions: {
bar: {
grouping: false,
shadow: false,
borderWidth: 0,
pointPadding: .25,
groupPadding: 0
},
scatter: {
marker: {
symbol: 'line',
lineWidth: 3,
radius: 9,
lineColor: '#333'
}
}
},
series: [{
name: 'Bands 3',
enableMouseTracking: false,
borderWidth: 0,
borderRadius: 0,
stacking: 'normal',
grouping: false,
color: 'rgba(156,156,156,.1)',
data: [2, 1.5, 1.5, 1.5, 2]
}, {
name: 'Bands 2',
enableMouseTracking: false,
borderWidth: 0,
borderRadius: 0,
stacking: 'normal',
grouping: false,
color: 'rgba(156,156,156,.4)',
data: [2, 1.5, 1.5, 2, 3]
}, {
//pointRange:1.1,
name: 'Bands 1',
enableMouseTracking: false,
borderWidth: 0,
borderRadius: 0,
stacking: 'normal',
grouping: false,
color: 'rgba(156,156,156,.7)',
data: [6, 7, 7, 6.5, 5]
}, {
name: 'Measure',
color: 'rgba(56,56,56,1)',
pointRange: .5,
zIndex: 10,
data: [7, 5, 9, 3, 6]
}, {
name: 'Target',
type: 'scatter',
zIndex: 20,
data: [7.5, 8, 7.5, 8.5, 8.5]
}]
});
</script>
</head>
<body>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height:350px;width:400px;margin:1em;"></div>
</body>
</html>