han73748196
2018-03-21 11:23
采纳率: 95.5%
浏览 3.2k
已采纳

echarts地图的问题。地图刷新点击事件重复

 var myChart = echarts.init(document.getElementById('map'));
 var option = {  
      title: {  
       text : '重庆市脱贫地区分布总览',  
       subtext : '当前区域信息',
       top:'20',
       textStyle: {
            fontSize: 18,
            color: '#333'          // 主标题文字颜色
        }
      },  
      series: [  
        {  
        name: '数据名称',  
        type: 'map',  
        mapType: '重庆', 
        top:'65',
        zoom:1.1, 
        selectedMode : 'single',  

            label: {
                        normal: {
                            show: true,//显示省份标签
                            textStyle:{color:"#fbfdfe"}//省份标签字体颜色
                        },    
                        emphasis: {//对应的鼠标悬浮效果
                            show: true,
                            textStyle:{color:"#323232"}
                        } 
                    },
                    itemStyle: {
                        normal: {
                            borderWidth: .5,//区域边框宽度
                            borderColor: '#0550c3',//区域边框颜色
                            areaColor:"#4ea397",//区域颜色

                        },

                        emphasis: {
                            borderWidth: .5,
                            borderColor: '#4b0082',
                            areaColor:"#ece39e",
                        }
                    }, 

        }]  
      };  
myChart.setOption(option);   

myChart.on('click', function (params) {//点击事件
        if (params.componentType === 'series') {
             var provinceName =params.name;
             $('#box').css('display','block');
             $("#box-title").html(provinceName);

            }
});

在一个div中放的是echarts地图,有点击事件,页面会每隔一段时间生成一个新的底图,但是在点击的时候会把以前的点击事件里面的弹框内容给弹出。会反复叠加弹出很多框。。问大神怎么解决

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

5条回答 默认 最新

  • u011094214 2018-03-23 07:51
    已采纳

    html中对按钮绑定点击事件的时候也遇到你这样的问题,明明只是绑定一个方法 ,为什么会走好几遍。
    后来把$("#id").bind("click",function(){ ... }) 改成 $("#id").unbind('click').bind("click",function(){ ... })
    这样成功了 你照这个思路修改一下 看看还有没有效果

    点赞 评论
  • hfhan_872914334 2018-03-21 14:13

    你点击事件是在更新函数里面写的吗?

    应该是重复绑定造成的,你在绑定点击事件之前先解绑下.unbind('click').on()

    点赞 评论
  • 没见你怎么更新的,click只需要绑定一次就行了吧,更新数据的时候不需要再myChart.on('click'绑定,一定要执行绑定,先off掉原来的

     myChart.off('click');
    myChart.on('click'...............
    
    点赞 评论
  • CUG_ZG 2018-03-22 03:06

    可能是你创建的myChart对象,没有调用dispose()方法给kill掉,刷新后有很多对象

    点赞 评论
  • baojiangfeng 2018-03-22 11:46

    2种方案
    1 像楼上说的
    //先解除以前绑定的click事件
    myChart.off('click');
    //再绑定新的点击事件
    myChart.on('click', function (params) {

    });
    2 点击事件只绑定一次 , 把绑定点击事件的方法提出来 . 不要重复执行 下面这段代码.
    myChart.on('click', function (params) {

    });

    点赞 评论

相关推荐 更多相似问题