/**
* 使用highchars展示图形
*/
function showView(viewType){
var char = new Highcharts.Chart({
//HighCharts中chart属性配置
chart: {
renderTo: 'information_date',//div 标签
type: viewType,//图表类型
/******************以下chart配置可选******************/
backgroundColor:"#EAF7FF",//图表背景色
borderWidth:5,//图表边框宽度
borderRadius:15,//图表边框圆角角度
plotBackgroundColor:"#6DBFBB",//主图表区背景颜色
plotBorderColor:'red',//主图表边框颜色
plotBorderWidth:2,//主图表边框宽度
shadow:true,//是否设置阴影
zoomType:'xy'//拖动鼠标放大图表的方向
},
credits : {
//enable:true,默认就为true,可以不配置
//如果想要去除版权(也就是不显示),只需要设置enable:false即可
href:'http://www.52wulian.org',//链接地址
position: { //文字的位置
x:-30,
y:-30
},
style:{ //文字的样式
color:'red',
fontWeight:'bold'
},
enabled:true,//不显示highCharts版权信息,不显示为false
text:'我爱物联网' //文字
},
/******************
**Colors-颜色属性为可选配置
**通过配置配置colors,可以轻松的设置数据列的颜色
1、颜色代码可以是十六进制,也可以是英文单词,
还可以是RGB,如同css
2、默认是从第一个数据列起调用第一个颜色代码,
有多少个数据列调用相应数量的颜色
3、当数据列大于默认颜色数量时,重复从第一个
颜色看是调用
******************/
colors:[
'#000000',//黑
'#FF0000',//红
'#00FF00',//绿
'#0000FF',//蓝
'#FFFF00',//黄
'#FF00FF',//紫
'#FFFFFF',//紫
],
exporting: {
//enabled:true,默认为可用,当设置为false时,图表的打印及导出功能失效
buttons:{ //配置按钮选项
printButton:{ //配置打印按钮
width:50,
symbolSize:20,
borderWidth:2,
borderRadius:0,
hoverBorderColor:'red',
height:30,
symbolX:25,
symbolY:15,
x:-200,
y:20
},
exportButton:{ //配置导出按钮
width:50,
symbolSize:20,
borderWidth:2,
borderRadius:0,
hoverBorderColor:'red',
height:30,
symbolX:25,
symbolY:15,
x:-150,
y:20
}
},
filename:'52wulian.org',//导出的文件名
type:'image/png',//导出的文件类型
width:800 //导出的文件宽度
},
labels:{
items:[{
//标签代码(html代码)
html:'<p style="font-size:20">Copyright © 2012-2013 </p><a href="http://www.52wulian.org" style="font-size:20;text-decoration: underline;">我爱物联网</a>',
style:{ //设置标签位置
left:'100px',
top:'50px'
}
}],
style:{ //设置标签颜色
color:'rgb(0,0,255)'
}
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
series: [{
name: 'Tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'New York',
data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
}, {
name: 'Berlin',
data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
}, {
name: 'London',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
}
highchars
最新推荐文章于 2022-04-28 18:00:04 发布