腾讯地图技术小记(一)

业务背景:

最近使用腾讯地图做技术支持的功能,具体是在地图上展现某块景区的内容,然后为了填充景区地图区域的美观性,使用覆盖图的形式,进行美化,但是地层的POI图标也就是地图上的超市、景观、车站等名称都被掩盖,也咨询过腾讯地图项目组,项目组的回复是因为的使用的是腾讯地图JavaScript组件中的map对象,此map对象用于手机端时,地图其实是每块切片组合而成,地图上的POI无法进行调整他的优先层级,可以理解为POI的标注只是一张图片。但是甲方想要标注出来每个景点的名称,这次就直接使用腾讯地图JavaScript组件中Label对象,此对象可以在地图上进行文字标注,标注内容可以是HTML标签,也可以通过方法来赋予Label对象CSS样式。
但是会出现一个这样的问题,景点的名称上部会有一个景点标识,景点标识跟景点的名称无法形成居中的效果,这里我用到了Label的Offset,对label的位置进行了偏移,但是景点名称大小不一,我们如何去做全适应的居中,一开始我尝试了多个if,可以实现效果,但是这样太笨重,如果出现更长的名称我们就要在代码中进行修改并调试,这会因为这个小事添加工作量.

解决方案:

1.限制名称长度,并且把每个长度下的状况都考虑到并写到代码里面去
2.使用等比数列的方式,利用公式的方式,来科学的调整文字的位置。
最后我选了第二个方案,因为确实比较省事,这也是我在开发生涯中第一次使用数学公式来进行解决问题,当然最后成功解决完问题的喜悦与成就感已经写满在了脸上。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值