highchars

/**
 * 使用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]  
           }]
	});
}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值