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

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

地圖組件如何顯示標(biāo)記的標(biāo)注氣泡

場景描述

標(biāo)記可以通過頻繁點擊或顯示來顯示文本，以描述與相應(yīng)標(biāo)記相關(guān)的信息。

實現(xiàn)思路

以下示例顯示如何在相應(yīng)的標(biāo)記上顯示普通文本氣泡。

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

解決方法

代碼如下:

模板

差異

地圖

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

scale={{scale}}

markers={{markers}}

/地圖

/div

/模板

腳本

const COORDTYPE = wgs84

常量標(biāo)記路徑= /Common/marker.png

北京WGS = {

緯度:39.9073728469，

經(jīng)度:116.3913445961，

坐標(biāo)類型:坐標(biāo)類型

}

導(dǎo)出默認(rèn)值{

私人:{

比例尺:17，

標(biāo)記:[

{

寬度:100%，

身高:50%，

緯度:BEIJINGWGS.latitude

經(jīng)度:BEIJINGWGS .經(jīng)度，

coord type:BEI JING WGS . coord type，

iconPath: MARKERPATH

寬度:100px，

標(biāo)注:{

內(nèi)容:這里是北京，

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

邊框半徑:20px，

textAlign: left，

顯示:始終

}

}

]

}

}

/腳本

更多參考

地圖組件:

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

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