highcharts的引用

1、官网下载地址:http://www.hcharts.cn/download.

2、下载完,引用<script type="text/javascript" src="highcharts/highcharts.js"></script>

3、在html上添加要引用的id <div id="container" style="height:220px;"></div>

4、在highcharts的官网上可以找到你想要的demo,地址:http://www.hcharts.cn/demo/highcharts

5、把你想要的demo复制到你新建的js文件中,并在html中引用。

6、注意:要加function ,还用使用的id要一致。以下是我的js代码:

$(function () {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: '告警情况'
},
xAxis: {
categories: ['UPS1', 'UPS2', 'UPS3', '烟感1', '烟感2', '烟感3']
},
yAxis: {
min: 0,
title: {
text: '告警次数(次)'
}
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
shared: true
},
plotOptions: {
column: {
stacking: 'percent'
}
},
series: [{
name: '一级',
data: [5, 3, 4, 7, 2]
}, {
name: '二级',
data: [2, 2, 3, 2, 1]
}, {
name: '三级',
data: [3, 4, 4, 2, 5]
}]
});
});

 

posted @ 2016-11-25 10:33  也许520  阅读(478)  评论(0编辑  收藏  举报