点击柱状图实现高亮效果

基本思路：ecahrt.setOption(newOption)

const myHistogram = echarts.init(document.getElementById('histogram'))
const histogramOption = {
	// ... 不相关的其他配置
	series: [
	  {
		type: 'bar',
		name: '数量',
		barWidth: '10%',
		label: {
		  show: true, //开启显示
		  position: 'top', //在上方显示 
		  color: '#3667fe',
		},
		itemStyle: {
		  barBorderRadius: [2, 2, 0, 0],
		  color: new echarts.graphic.LinearGradient(
			0, 0, 0, 1, [{
			  offset: 0,
			  color: '#5f9afe'
			},
			{
			  offset: 1,
			  color: '#3667fe'
			}
		  ]), // 颜色渐变
		},
		data: [11, 22, 33, 44, 55, 66]
	  },
	]
}
myHistogram.setOption(histogramOption)

const that = this
myHistogram.on('click', function (params) {
    // 恢复初始设置
	myHistogram.setOption(histogramOption)
	// 被点击的柱状图及label变色 
	// 为了不影响初始设置，必须为深拷贝
	const newOption = JSON.parse(JSON.stringify(histogramOption))
	newOption.series[0].data[params.dataIndex] = {
	  value: histogramOption1.series[0].data[params.dataIndex],
	  itemStyle: {
		barBorderRadius: [2, 2, 0, 0],
		color: new echarts.graphic.LinearGradient(
		  0, 0, 0, 1, [{
			offset: 0,
			color: '#8BF5FF', 
		  },
		  {
			offset: 1,
			color: '#35EDFE'
		  }
		]
		),
	  },
	  label:{
		color:'#35EDFE'
	  }
	}
	myHistogram.setOption(newOption)
 })