地图点击事件不生效

高德地图自定义文本标记点击事件半边不生效(已解决)

使用审查元素即可发现 , 自定义文本大小设计比较小, 文字超出自定义文本宽度,鼠标点击无效。
只需将自定义文本宽度加宽

自定义文本动态计算文字代码宽度

// An highlighted block
 var myIcon = new AMap.Icon({
         size: new AMap.Size(14 * dataList[i].name.length / 2 + 56, 38 +19),//14 为字体大小 * 文字个数
         image: url,//图标
         imageSize: new AMap.Size(52, 38),	//图片大小
         imageOffset: new AMap.Pixel(0, 19) //图标偏移量
       })



//创建标注文本
              var labcontent = `<div class="info"
                 style="color:#fff;
                  background-color:rgba(22,255,175,0.20);
                  border-radius:6px;
                  border-color:#16ffaf;
                  padding:0 10px 10px 10px;
                  font-size:14px;
                  border:solid 1px #16ffaf;
                  cursor:pointer;
                  height:36px;
                  line-height:36px;
                  font-family: "Source Han Sans CN;">${dataList[i].shortName}</div>` //设置文本标注内容
              marker.setLabel({
                offset: new AMap.Pixel( -14 * dataList[i].name.length / 2 -5  , -10 ), //设置文本标注偏移量  设置负值  覆盖到自定义文本内
                content: labcontent,
                direction: 'right', //设置文本标注方位
              })

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值