百度地图Javascript API 使用记录
生活随笔
收集整理的這篇文章主要介紹了
百度地图Javascript API 使用记录
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
API版本
GL
起因
在項目開發過程中對地圖上的點標注,需要通過點擊標注點,展示頁面上的其他組件,此時需要將該標注點移動到其他位置(通過 `map`對象的 `panBy()`方法), 此時就需要獲取當前點擊的標注點在屏幕上的坐標位置
Bug說明
在標注點的事件對象中,獲取到的clientX、 clientY、offsetX、offsetY的值均為 undefined
?
原因分析
在web端中,鼠標點擊事件可通過 事件對象的 clientX, clientY 對象獲取鼠標的位置
但在移動端,相對應地事件為 touch事件,通過對地圖標注事件對象中獲取到的clientX、clientY 屬性為 undefined
當時項目運行在移動端
解決方案
通過獲取事件對象的 target 屬性獲取 Element 元素,調用其 getBoundingClientRect()方法獲取其 x,y,width,height等結果,計算得到其坐標位置
示例代碼
?// labelMarker 對自定義的標注文本對象labelMarker.addEventListener('click', async (e) => {console.log(e)// 通過調用獲取事件DOM對象的 獲取在視口區域的位置const { x, y, width, height } = e.target.domElement.getBoundingClientRect()console.log(x,y,width,height)// 其他操作})總結
以上是生活随笔為你收集整理的百度地图Javascript API 使用记录的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: §0.2集合论基础
- 下一篇: 无需代码,1秒搞定QQ和微信多开!