首页 > 代码库 > highchart 曲线图
highchart 曲线图
$(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 =http://www.mamicode.com/ [], 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>
highchart 曲线图
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。