$(function() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container', //图表放置的容器,DIV
defaultSeriesType: 'spline', //图表类型为曲线图
events: {
load: function() { }
}
},
title: {
text: '网络接收流量' //图表标题
},
xAxis: { //设置X轴
type: 'datetime', //X轴为日期时间类型
tickPixelInterval: 150 //X轴标签间隔
},
yAxis: { //设置Y轴
title:{
text: '网络接收流量'
},
max: 102400, //Y轴最大值
min: 0, //Y轴最小值
labels: {
formatter: function() {
return this.value/1000 +'KB';
}
}
},
tooltip: {//当鼠标悬置数据点时的提示框
formatter: function() { //格式化提示信息
// return '网络流量'+
// Highcharts.dateFormat('%H:%M:%S', this.x) +''+
// Highcharts.numberFormat(this.y, 2)+'%';
}
},
legend: {
enabled: false //设置图例不可见
},
exporting: {
enabled: false //设置导出按钮不可用
},
credits: {
text: '', //设置LOGO区文字
url: '' //设置LOGO链接地址
},
series: [{
data: (function() { //设置默认数据,
var data = [],
time = (new Date()).getTime(),
i; for (i = -19; i <= 0; i++) {
data.push({
x: 1410213036000,
y: 1250
});
} return data;
})()
}]
});
});
<!doctype html>
<html lang="en">
<head>
<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script>
<script>
//左侧Javascript代码
</script>
</head>
<body>
<div id="container" style="min-width:700px;height:400px"></div>
</body>
</html>
05-11 16:54