html页面
<html>
<head>
<meta charset="UTF-8" />
<title>补数完成率</title>
<script src="js/jquery.min.js"></script>
<script src="js/highcharts.js"></script>
</head>
<body>
<div id="container" style="width: 55%; height: 400px; margin: 0 auto"></div>
<script language="JavaScript">
$(document).ready(function() {
var chart = {
type: 'column'
};
var title = {
text: '补数完成率'
};
var xAxis = {
categories: ['A','B','C','D','E','F'],
crosshair: true
};
var yAxis = {
min: 0,
max: 100,
title: {
text: '完成率(%)'
},
labels: {
formatter:function (){
return this.value + '%' ;
}
}
};
var tooltip = {
headerFormat: '<span style="font-size:10px">{series.name}{point.key}</span><table>',
pointFormat: '<tr><span>{point.key}</span><td style="color:{series.color};padding:0"><b>{point.y:.2f}%</b> </td></tr>',
footerFormat: '</table>',
borderRadius: 20,
shared: true,
useHTML: true
};
var plotOptions = {
column: {
pointPadding: 0.2,
borderWidth: 0
}
};
var credits = {
enabled: false
};
var arr = [100,100,80,71,66,50];
var series= [{
name: '检验人员',
data: arr
}];
var json = {};
json.chart = chart;
json.title = title;
json.tooltip = tooltip;
json.xAxis = xAxis;
json.yAxis = yAxis;
json.series = series;
json.plotOptions = plotOptions;
json.credits = credits;
$('#container').highcharts(json);
});
</script>
</body>
</html>
所需js文件：jquery.min.js highcharts.js
效果图：
3219
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
