echarts地图

echarts地图中点击页面其他地方之后选中echarts地图上某个点高亮可以这样写

const mapEcharts = this.$echarts.init(document.getElementById("map"));
//显示点击的当前的tooltip某个点
mapEcharts.dispatchAction({
    type: "showTip",
    dataIndex: index,
    seriesIndex: 0,
});
//高亮某个点
mapEcharts.dispatchAction({
  type: "select",
  name: item.name,
});

如果还有点击北京体育大学出现弹框这种需求，就这样写

tooltip: {
                    trigger: "item",
                    triggerOn: "click",
                    backgroundColor: 'rgba(9, 36, 62, 0.5)',
                    // backgroundColor: 'transparent',
                    textStyle: {
                        color: '#6FD78D',
                    },
                    enterable: true,
                    formatter: params => {
                        const result = `
                            <div>
                                <p id="showEcharts" style="cursor: pointer;color:         #f3cd47;">${ params.name }</p>
                                
                            </div>
                        `;
                        return result;
                    }
                },

一般来说如果有triggerOn: "click",这种属性的时候就会出现点击其他地方的时候，tooltip提示框和点击名称出现弹框会同时出现，此刻出现了冒泡，这时候可以这样做

mapEcharts.on("click", params => {
                console.log(params)
                console.log(params.event)

                if(params.seriesType == "scatter") {
                    mapEcharts.dispatchAction({
                        type: 'showTip'
                    });
                    this.$nextTick(() => {
                       //关键部分，通过jq绑定上面tooltip的formatter上设置的id来绑定click事件，避免冒泡
                        $("#showEcharts").click(() => {
                            this.showTooltipEcharts = true;
                            this.tooltipEchartsTitle = params.name;
                            this.echarts8_9_data(2, params.name);
                        })
                    })
                }else {
                    this.showTooltipEcharts = false;
                    // mapEcharts.dispatchAction({
                    //     type: 'hideTip'
                    // });
                }
            });

另外设置series的selectedMode(设置可以选中一个点还是多个)，select(选中的点的颜色)， largeThreshold(有很多点的时候开启echarts快速加载避免页面卡顿)

                    series: [
                        {
                       
                        largeThreshold: 10000,
                        selectedMode: 'single',
                        select: {
                            itemStyle: {
                                color: '#f3cd47'
                            }
                        },
                    ]