map組件如何展示marker的callout氣泡,map容器使用技巧,小程序map marker真機不顯示-ESG跨境

map組件如何展示marker的callout氣泡,map容器使用技巧,小程序map marker真機不顯示

地圖組件如何顯示標記的標注氣泡

場景描述

標記可以通過頻繁點擊或顯示來顯示文本，以描述與相應標記相關的信息。

實現思路

以下示例顯示如何在相應的標記上顯示普通文本氣泡。

由于文本氣泡的寬度和高度不能自定義，即氣泡根據文本內容來適應寬度和高度，這意味著textAlign屬性。只有當文本內容包含換行符(\n)時，才能有直觀的視覺效果。

解決方法

代碼如下:

模板

差異

地圖

style = width:{ { width } }；高度:{{height}}

scale={{scale}}

markers={{markers}}

/地圖

/div

/模板

腳本

const COORDTYPE = wgs84

常量標記路徑= /Common/marker.png

北京WGS = {

緯度:39.9073728469，

經度:116.3913445961，

坐標類型:坐標類型

}

導出默認值{

私人:{

比例尺:17，

標記:[

{

寬度:100%，

身高:50%，

緯度:BEIJINGWGS.latitude

經度:BEIJINGWGS .經度，

coord type:BEI JING WGS . coord type，

iconPath: MARKERPATH

寬度:100px，

標注:{

內容:這里是北京，

填充:20px 5px 20px 5px，

邊框半徑:20px，

textAlign: left，

顯示:始終

}

}

]

}

}

/腳本

更多參考

地圖組件:

https://developer . Huawei . com/consumer/cn/doc/development/quick appReferences/quick appcomponentmap

特別聲明：以上文章內容僅代表作者本人觀點，不代表ESG跨境電商觀點或立場。如有關于作品內容、版權或其它問題請于作品發(fā)表后的30日內與ESG跨境電商聯(lián)系。