echarts gl中的bar3D柱图高亮显示那个方法是不是不支持echarts bar3D配置项内容和展示
echarts api里的高亮方法是myChart.dispatchAction，highlight以前用这个试过饼图都好用，但是GL里是不是用这个方法高亮柱图是不是不支持啊？希望能快点帮忙解答下，现在项目着急实现这个效果，蟹蟹了。。
配置项如下
var geoCoordMap = {
/*站点真实坐标*/
"281台": [102.73, 25.04],
'201台': [87.273865,44.02027],
'202台': [91.1865,30.1465],
'203台': [111.65, 40.82],
'282台': [113.0823,28.2568],
'291台': [103.5901,36.3043],
'292台': [120.4651,36.3373],
'293台': [113.4668,34.6234],
'553台': [121.4648,31.2891],
'573台': [116.46, 39.92],
'成都台': [103.9526,30.7617],
'哈尔滨台': [127.9688,45.368],
'海南台': [110.3893,19.8516],
'西安台': [109.1162,34.2004],
'厦门台': [118.1689,24.6478],
/*日报假坐标*/
'281日报': [101.73, 25.04],
'201日报': [85.273865,44.02027],
'202日报': [90.1865,30.1465],
'203日报': [110.65, 40.82],
'282日报': [112.0823,28.2568],
'291日报': [102.5901,36.3043],
'292日报': [119.4651,36.3373],
'293日报': [112.4668,34.6234],
'553日报': [120.4648,31.2891],
'573日报': [115.46, 39.92],
'成都台日报': [102.9526,30.7617],
'哈尔滨台日报': [126.9688,45.368],
'海南台日报': [109.3893,19.8516],
'西安台日报': [108.1162,34.2004],
'厦门台日报': [117.1689,24.6478],
/*周报假坐标*/
'281周报': [102.73, 25.04],
'201周报': [86.273865,44.02027],
'202周报': [91.1865,30.1465],
'203周报': [111.65, 40.82],
'282周报': [113.0823,28.2568],
'291周报': [103.5901,36.3043],
'292周报': [120.4651,36.3373],
'293周报': [113.4668,34.6234],
'553周报': [121.4648,31.2891],
'573周报': [116.46, 39.92],
'成都台周报': [103.9526,30.7617],
'哈尔滨台周报': [127.9688,45.368],
'海南台周报': [110.3893,19.8516],
'西安台周报': [109.1162,34.2004],
'厦门台周报': [118.1689,24.6478],
/*月报假坐标*/
'281月报': [103.73, 25.04],
'201月报': [87.273865,44.02027],
'202月报': [92.1865,30.1465],
'203月报': [112.65, 40.82],
'282月报': [114.0823,28.2568],
'291月报': [104.5901,36.3043],
'292月报': [121.4651,36.3373],
'293月报': [114.4668,34.6234],
'553月报': [122.4648,31.2891],
'573月报': [117.46, 39.92],
'成都台月报': [104.9526,30.7617],
'哈尔滨台月报': [128.9688,45.368],
'海南台月报': [111.3893,19.8516],
'西安台月报': [110.1162,34.2004],
'厦门台月报': [119.1689,24.6478],
/*年报假坐标*/
'281年报': [104.73, 25.04],
'201年报': [88.273865,44.02027],
'202年报': [93.1865,30.1465],
'203年报': [113.65, 40.82],
'282年报': [115.0823,28.2568],
'291年报': [105.5901,36.3043],
'292年报': [122.4651,36.3373],
'293年报': [115.4668,34.6234],
'553年报': [123.4648,31.2891],
'573年报': [118.46, 39.92],
'成都台年报': [105.9526,30.7617],
'哈尔滨台年报': [129.9688,45.368],
'海南台年报': [112.3893,19.8516],
'西安台年报': [111.1162,34.2004],
'厦门台年报': [120.1689,24.6478],
};
var convertData = function(data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value)
});
}
}
console.log(res)
return res;
};
option = {
backgroundColor:'#034d98',
title: {
text: '',
x: 'left',
top: "10",
textStyle: {
color: '#000',
fontSize: 14
}
},
tooltip: {
show: true,
borderColor: '#fff',
borderWidth: 1,
textStyle: {
color: '#c3c1b5'
},
},
itemStyle: {
emphasis: {
borderColor: '#fff',
borderWidth: 1
}
},
geo3D: {
map: 'china',
roam: true,
shading:'lambert',
postEffect:{
enable:false,
bloom:{
enable:false,
bloomIntensity:1
}
},
itemStyle: { //初始化地图区域颜色
areaColor: 'rgba(0,0,0,0.5)',
opacity:0.9,
borderWidth: 1,
borderColor: 'rgba(4,103,188,1)'
},
instancing:false,
label: {
show: false,
textStyle: {
color: 'rgba(255,255,255,0.9)',
fontSize: 10,
fontFamily: '微软雅黑',
backgroundColor: 'rgba(0,23,11,0)'
},
},
emphasis: { //当鼠标放上去 地区区域是否显示名称
label: {
show: false,
textStyle: {
color: 'red',
fontSize: 3,
}
},
itemStyle: {
areaColor: '#1a4589',
}
},
viewControl: {
projection:'perspective',
autoRotate:false,
autoRotateSpeed:10,
alpha:30,
height:700,
distance:80,
minDistance:1,
maxBeta:null,
minBeta:null,
},
top:0,
},
series:[
/*日报*/
{
type:'bar3D',
name:'日报',
stack:'1',
coordinateSystem: 'geo3D',
barSize:0.8,
bevelSize:0.3,
label:{
show:true,
distance:1,
formatter: (params) => {
let data = params.value[2];
return data;
},
textStyle: {
color:'#55d8d6',
fontWeight:'bolder',
fontSize: 14,
borderWidth: 2,
backgroundColor: 'rgba(0,23,11,0)'
}
},
itemStyle:{
color:'#55d8d6',
opacity:0.9,
},
data: convertData([
{name: "201日报",value:574},
{name: "281日报",value:800},
{name: "202日报",value:300},
{name: "203日报",value:178},
{name: "282日报",value:391},
{name: "291日报",value:178},
{name: "292日报",value:713},
{name: "293日报",value:246},
{name: "553日报",value:576},
{name: "573日报",value:142},
{name: "成都台日报",value:345},
{name: "哈尔滨台日报",value:245},
{name: "海南台日报",value:278},
{name: "西安台日报",value:714},
{name: "厦门台日报",value:145},
]),
},
/*周报*/
{
type:'bar3D',
name:'周报',
stack:'2',
coordinateSystem: 'geo3D',
barSize:0.8,
bevelSize:0.3,
label:{
show:true,
distance:1,
formatter: (params) => {
let data = params.value[2];
return data;
},
textStyle: {
color:'#71a870',
fontWeight:'bolder',
fontSize: 14,
borderWidth: 2,
backgroundColor: 'rgba(0,23,11,0)'
}
},
itemStyle:{
color:'#71a870',
opacity:0.9,
},
data: convertData([
{name: "281周报",value:452},
{name: "201周报",value:274},
{name: "202周报",value:344},
{name: "203周报",value:226},
{name: "282周报",value:278},
{name: "291周报",value:647},
{name: "292周报",value:475},
{name: "293周报",value:175},
{name: "553周报",value:389},
{name: "573周报",value:710},
{name: "成都台周报",value:587},
{name: "哈尔滨台周报",value:545},
{name: "海南台周报",value:578},
{name: "西安台周报",value:365},
{name: "厦门台周报",value:521},
]),
},
/*月报*/
{
type:'bar3D',
name:'月报',
stack:'3',
coordinateSystem: 'geo3D',
barSize:0.8,
bevelSize:0.3,
label:{
show:true,
distance:1,
formatter: (params) => {
let data = params.value[2];
return data;
},
textStyle: {
color:'#a2b172',
fontWeight:'bolder',
fontSize: 14,
borderWidth: 2,
backgroundColor: 'rgba(0,23,11,0)'
}
},
itemStyle:{
color:'#a2b172',
opacity:0.9,
},
data: convertData([
{name: "281月报",value: 452},
{name: "201月报",value: 471},
{name: "202月报",value: 197},
{name: "203月报",value:573},
{name: "282月报",value:314},
{name: "291月报",value:278},
{name: "292月报",value:475},
{name: "293月报",value:874},
{name: "553月报",value:745},
{name: "573月报",value:286},
{name: "成都台月报",value:745},
{name: "哈尔滨台月报",value:645},
{name: "海南台月报",value:878},
{name: "西安台月报",value:142},
{name: "厦门台月报",value:513},
]),
},
/*年报*/
{
type:'bar3D',
name:'年报',
stack:'4',
coordinateSystem: 'geo3D',
barSize:0.8,
bevelSize:0.3,
label:{
show:true,
distance:1,
formatter: (params) => {
let data = params.value[2];
return data;
},
textStyle: {
color:'#a58060',
fontWeight:'bolder',
fontSize: 14,
borderWidth: 2,
backgroundColor: 'rgba(0,23,11,0)'
}
},
itemStyle:{
color:'#a58060',
opacity:0.9,
},
data: convertData([
{name: "281年报",value: 279},
{name: "201年报",value: 174},
{name: "202年报",value: 321},
{name: "203年报",value: 397},
{name: "282年报",value: 145},
{name: "291年报",value:578},
{name: "292年报",value:371},
{name: "293年报",value:171},
{name: "553年报",value:667},
{name: "573年报",value:386},
{name: "成都台年报",value:471},
{name: "哈尔滨台年报",value:445},
{name: "海南台年报",value:378},
{name: "西安台年报",value:612},
{name: "厦门台年报",value:478},
]),
},
/*直属台名字*/
{
name: 'scatter3D',
type: "scatter3D",
coordinateSystem: 'geo3D',
symbol: 'pin',
symbolSize: 0,
opacity: 1,
label: {
show: true,
formatter: '{b}',
distance:-5,
position:'bottom',
textStyle: {
color: '#fff',
fontSize: 16,
backgroundColor: 'rgba(0,23,11,0)'
}
},
itemStyle: {
borderWidth: 0.5,
borderColor: '#fff',
},
data: convertData([
{name: "201台",value: 0},
{name: "202台",value: 0},
{name: "203台",value: 0},
{name: "281台",value: 0},
{name: "282台",value: 0},
{name: "291台",value: 0},
{name: "292台",value: 0},
{name: "293台",value: 0},
{name: "553台",value: 0},
{name: "573台",value: 0},
{name: "成都台",value: 0},
{name: "哈尔滨台",value: 0},
{name: "海南台",value: 0},
{name: "西安台",value: 0},
{name: "厦门台",value: 0},
]),
}
]
}
/*想要通过API提供的高亮显示方法高亮bar3D柱图不好用*/
myChart.setOption(option);
myChart.dispatchAction({
type:'hightlight',
seriesIndex:1,
seriesName:'周报',
dataIndex:'0',
name:'201周报',
})
截图如下
