echart3里地图点击事件怎么添加

echart3里地图点击事件怎么添加,第1张

onMouseOver 实现状态二 onMouseOut 实现鼠标移开状态 至于鼠标按下状态没有意义

对于状态三 你需要建立一个全局变量记录此时元素的状态 然后只有onClick 即可 onClick

之后判断点击前元素状态,若为状态1则点击后元素到达状态3 若原本为状态3点击后回到状态1 (不要忘记点击后对应状态改变那个全局变量)

API上不是有吗?

option= {

                title: {

                    text:'山东省事业费开支情况',

                    textStyle:{fontSize: 20,fontWeight:'bolder',color:'#333'},

                    x:'center'

                },

                tooltip: {

                    trigger:'item'

                },

                legend: {

                    orient:'vertical',

                   x:'left',

                    data: ['开支比例']

               },

                dataRange: {

               min: 0,

               max: 1000,

               color:['orange','yellow'],

               text:['高','低'],

               x:'right',

               y:'bottom',

               calculable : true

               },

                series: [

        {

            name:'开支比例',

            type:'map',

            mapType:'山东',

            selectedMode: 'single',

            itemStyle: {

                normal: { label: { show:true },color:'black' },

                emphasis: { label: { show:true} }

            },

            mapLocation:{x:'center',y:'center'},

            mapValuePrecision:2,

            roam:false,

            data: [

 {name: "烟台市",value: Math.round(Math.random()*1000)},

 {name: "临沂市",value: Math.round(Math.random()*1000)},

 {name: "潍坊市",value: Math.round(Math.random()*1000)},

 {name: "青岛市",value: Math.round(Math.random()*1000)},

 {name: "菏泽市",value: Math.round(Math.random()*1000)},

 {name: "济宁市",value: Math.round(Math.random()*1000)},

 {name: "德州市",value: Math.round(Math.random()*1000)},

 {name: "滨州市",value: Math.round(Math.random()*1000)},

 {name: '聊城市',value: Math.round(Math.random()*1000)},

 {name: "东营市",value: Math.round(Math.random()*1000)},

 {name: "济南市",value: Math.round(Math.random()*1000)},

 {name: "泰安市",value: Math.round(Math.random()*1000)},

 {name: "威海市",value: Math.round(Math.random()*1000)},

 {name: "日照市",value: Math.round(Math.random()*1000)},

 {name: "淄博市",value: Math.round(Math.random()*1000)},

 {name: "枣庄市",value: Math.round(Math.random()*1000)},

 {name: "莱芜市",value: Math.round(Math.random()*1000)}

 

        ],

        geoCoord: {

             "烟台":[120.78,37.63],

         "潍坊":[119.14,36.64],

         "临沂":[118.35,35.40],

         "青岛":[120.50,36.45],

         "济南":[117.20,36.98],

         "莱芜":[117.70,36.38],

         "滨州":[117.87,37.60],

         "聊城":[115.96,36.51],

         "日照":[119.32,35.61],

         "泰安":[117.07,36.16],

         "济宁":[116.88,35.45],

         "枣庄":[117.36,35.00],

         "淄博":[118.08,36.72],

         "德州":[116.73,37.32],

         "威海":[122.00,37.25],

         "东营":[118.75,37.67],

         "菏泽":[115.66,35.32]

        }

        },

        {

            name: '存在超支项目',

            type: 'map',

            mapType: '山东',

            data:[],

            markPoint : {

                symbol:'star',

                symbolSize : 10,

                effect : {

                    show: true,

                    color:'red',

                    shadowColor:'red',

                    //period: 10,

                    shadowBlur : 0

                },

                itemStyle:{

                    normal:{

                        label:{show:false}

                    }

                },

                data : [

 

                    {name: "菏泽", value:500}

                   

                ]

            }

        }

    ]

    }

 var ecConfig = require('echarts/config')

 myChart.on(ecConfig.EVENT.CLICK, eConsole)

 function eConsole(param){

       alert(1111) 

    alert(param.name)

 }


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11807839.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-18
下一篇 2023-05-18

发表评论

登录后才能评论

评论列表(0条)

保存