国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Vue：如何在地圖上添加自定義覆蓋物（點(diǎn)）

Aklman / 3445人閱讀

摘要：目錄如何在地圖上添加自定義覆蓋物點(diǎn)首發(fā)日期如何在地圖上添加自定義覆蓋物點(diǎn)如何在地圖上添加自定義覆蓋物點(diǎn)此文重點(diǎn)是在地圖上標(biāo)點(diǎn)，所以就省去引入百度地圖的步驟了。這個效果主要是利用百度地圖的覆蓋物來實(shí)現(xiàn)的。

目錄

  • 如何在地圖上添加自定義覆蓋物（點(diǎn)）

首發(fā)日期：2019-1-25

如何在地圖上添加自定義覆蓋物（點(diǎn)）



此文重點(diǎn)是在地圖上標(biāo)點(diǎn)，所以就省去引入百度地圖的步驟了。


先給一下最終的效果。


這個效果主要是利用百度地圖的“覆蓋物”來實(shí)現(xiàn)的。
由于我做的這個要求顯示不同的顏色來代表不同的所屬者，所以就做的麻煩一點(diǎn)。


如果你的需求不要求特別顯示，那么可以使用bm-marker

代碼大致如下：
  • 上面的代碼中position里面的值是經(jīng)緯度。有了經(jīng)緯度來能夠標(biāo)上點(diǎn)。
  • ak是你申請的百度api的key
  • center是城市中心




如果你希望使用特別的圖標(biāo)來給標(biāo)上全部點(diǎn)，那么也可以使用bm-marker，它里面有一個icon屬性，icon里面的圖片可以用來標(biāo)點(diǎn)：
  • icon中的url是圖片的url路徑。




如果你想要顯示多種覆蓋物，那么你可以使用overlay。（要封裝，因?yàn)榉庋b之后才能傳值進(jìn)去指定顯示什么覆蓋物）
簡單的overlay是這樣子的：

為什么可以基于這個組件來封裝是因?yàn)檫@個組件有以下幾個好處：

  1. 可以定制文本內(nèi)容
  2. 它本身是一個元素，而不是一個圖片，（上面的“打點(diǎn)物”都是圖片（小紅點(diǎn)不確定是不是，可能是一個字體圖標(biāo)的東西）），因?yàn)槭窃兀晕覀兡軌蚴褂胋order,background，color等等樣式來處理這個元素。


需求實(shí)現(xiàn)步驟：
1.定義一個MyOverLay:


2.使用MyOverLay,傳給它需要的值：

想了解更多，可以查看Vue百度地圖api的官網(wǎng)：https://dafrok.github.io/vue-baidu-map/#/

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/1266.html

相關(guān)文章

  • 百度地圖開發(fā)實(shí)例番外篇--實(shí)用方法（持續(xù)更新）

    摘要：一前言在使用百度地圖開發(fā)的過程中，查閱百度地圖官網(wǎng)基本上就能滿足開發(fā)的需求，但是有時候需要設(shè)置一些東西，很難在官網(wǎng)上查閱到相關(guān)的方法技巧。希望百度地圖能夠越來越強(qiáng)大，這樣開發(fā)者就可以愉快的開發(fā)了 一 前言 在使用百度地圖開發(fā)的過程中，查閱百度地圖官網(wǎng)demo基本上就能滿足開發(fā)的需求，但是有時候需要設(shè)置一些東西，很難在官網(wǎng)上查閱到相關(guān)的方法技巧。筆者特意把開發(fā)過程中遇到的一些疑難雜癥和解...

    CocoaChina 評論0 收藏0

  • 第三方庫

    摘要：微信支付，支付寶支付，銀聯(lián)支付三大支付總結(jié)支付寶植入總結(jié)支付寶的植基于和百度地圖的組件庫基于百度地圖封裝的組件庫，使用這個庫最好需要先了解和百度地圖。 Commento - 多說 & Disqus 開源替代品 Commento - 多說 & Disqus 開源替代品 anime.js 簡單入門教程 強(qiáng)大輕量的動畫庫 anime.js 入門教程 來自B站的開源的MagicaSakura源...

    seanHai 評論0 收藏0

  • 第三方庫

    摘要：微信支付，支付寶支付，銀聯(lián)支付三大支付總結(jié)支付寶植入總結(jié)支付寶的植基于和百度地圖的組件庫基于百度地圖封裝的組件庫，使用這個庫最好需要先了解和百度地圖。 Commento - 多說 & Disqus 開源替代品 Commento - 多說 & Disqus 開源替代品 anime.js 簡單入門教程 強(qiáng)大輕量的動畫庫 anime.js 入門教程 來自B站的開源的MagicaSakura源...

    gityuan 評論0 收藏0

  • vue地圖可視化 ArcGIS篇（3）

    摘要：不建議底圖選擇中存在兩種不同坐標(biāo)體系，如下圖坐標(biāo)存在明顯的偏差，火星坐標(biāo)在采用坐標(biāo)系的地圖上位置偏上彩色中國天地圖全球衛(wèi)星地圖例如我們使用的類進(jìn)行查找，返回的數(shù)據(jù)都是國際坐標(biāo)，因此必須進(jìn)行偏差糾正。 ArcGIS for javascript開發(fā)心得 本次實(shí)例中采用ArcGIS for javascript3.24版本，由于版本3與4在API等存在較大區(qū)別，就不一一列舉，詳細(xì)區(qū)別看官方...

    oogh 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<