Highcharts的一些操作



去掉打印按钮

Highcharts官网实例eg:https://jshare.com.cn/demos/NPVyQW

exporting:{ 
		enabled:true //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示 
},

去掉右下角的网址信息

Highcharts官网实例eg:https://jshare.com.cn/demos/NPVyQW

credits: {
		enabled:false   //去掉网址信息
	},

隐藏图例

Highcharts官网实例eg:https://jshare.com.cn/demos/NPVyQW
即:点击柱状图下边的 蓝色小圆和文字 会将数据隐藏
在这里插入图片描述
隐藏代码:

legend: {
		//隐藏图例
		enabled: false                                                          
	},

导出数据设置

设置一个js即可

"http://cdn.hcharts.cn/libs/highcharts-export-csv/export-csv.js"   //2018年版本成功
或者
http://cdn.hcharts.cn/highcharts/modules/export-data.js    -- 这个在官网可以成功(2019年版本)

柱状图默认显示数字

plotOptions: {
     column:{
         dataLabels:{
             enabled:true, // dataLabels设为true
             style:{
                 color:'#000'
             }
         }
     }
},

3D饼图,显示对应的值和百分比

效果图:
在这里插入图片描述

plotOptions: {
		pie: {
			allowPointSelect: true,
			cursor: 'pointer',
			depth: 35,
			dataLabels: {
				enabled: true,
				//format: '{point.name}'
				formatter: function() {
					//this 为当前的点(扇区)对象,可以通过 console.log(this) 来查看详细信息
					return '+ this.point.color + '"> '+this.point.name+':' 
						+ this.y + '个,占比' + Highcharts.numberFormat(this.percentage, 1) + '%';
				}
			}
		}
	},