資訊專欄INFORMATION COLUMN
摘要：不易于后期更換圖片標(biāo)記二使用靜態(tài)資源廢話不多直接上代碼我們在項目文件夾下新建一個圖片，然后將所有的靜態(tài)資源都放入這個文件夾中，這樣打包的時候，依舊能找到圖片路徑，并且圖片是獨(dú)立打包稱文件夾。
高德Marker 類中有關(guān)于icon 圖片的使用，現(xiàn)有兩種方式可以實(shí)現(xiàn)
一.使用import 導(dǎo)入在組件中直接import svg from "demo/run.svg"
然后再初始化Marker標(biāo)記的時候
let marker = new AMap.Marker({
position: new AMap.LngLat(item.LONGITUDE, item.LATITUDE),
title: item.ADDRESS,
offset: new AMap.Pixel(-10, -10),
icon: svg
});
在icon導(dǎo)入svg就可以了，這是第一種方式，可以實(shí)現(xiàn)marker類標(biāo)記圖片
但是這種方式存在一個缺點(diǎn)即 圖片在build后會以base64形式被打包到j(luò)s文件中。不易于后期更換圖片標(biāo)記;
二.使用靜態(tài)資源--廢話不多直接上代碼
let marker = new AMap.Marker({
position: new AMap.LngLat(item.LONGITUDE, item.LATITUDE),
title: item.ADDRESS,
offset: new AMap.Pixel(-10, -10),
icon: "static/img/running.svg"
});
我們在項目static文件夾下新建一個img圖片，然后將所有的靜態(tài)資源都放入這個文件夾中，這樣打包的時候，依舊能找到圖片路徑，并且圖片是獨(dú)立打包稱文件夾。不過這種方式需要配置webpack才行， 方法 可以看我這篇文章;
總結(jié)個人推薦方法二，這種方式更易于圖片更換以及后期維護(hù)，而方法一如有更改必須每次打包項目才行;
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/96172.html
摘要：高德地圖入門四地圖覆蓋物覆蓋物類名說明是否插件點(diǎn)標(biāo)記否覆蓋物點(diǎn)標(biāo)記復(fù)雜點(diǎn)標(biāo)記對象，對普通點(diǎn)標(biāo)記的擴(kuò)展否覆蓋物折線否覆蓋物多邊形否覆蓋物圓否圖片覆蓋物否地圖右鍵菜單否點(diǎn)標(biāo)記預(yù)覽自定義點(diǎn)標(biāo)記預(yù)覽多邊形預(yù)覽右鍵菜單添加右鍵菜單內(nèi)容項放大縮小添加 高德地圖 Javascript API 入門（四） 地圖覆蓋物 覆蓋物 類名 說明 是否插件 AMap.Marker 點(diǎn)標(biāo)記 否 AM...
摘要：效果圖準(zhǔn)備工作高德地圖申請安裝中國地圖高德地圖官方點(diǎn)我進(jìn)入創(chuàng)建動態(tài)創(chuàng)建標(biāo)簽后的是需要的插件中國地圖安裝開始使用創(chuàng)建組件寫入需要的分布指數(shù)高低寫入高德地圖需要的 效果圖 showImg(https://user-gold-cdn.xitu.io/2019/5/24/16ae7a7f2f9cac45); 準(zhǔn)備工作 高德地圖申請key 安裝Echarts 中國地圖 高德地圖 官方API...
摘要：看了上面有集成的高德地圖組件，但由于項目所要用到的不多，所以決定跟著文檔寫一寫運(yùn)行環(huán)境是引入高德地圖一般用使用最簡單粗暴的引入地圖的方法就是，在入口的頭部直接引入，記得一定要帶上如果沒有的話去高德地圖的官網(wǎng)申請一個。 看了github上面有集成的高德地圖組件，但由于項目所要用到的不多，所以決定跟著文檔寫一寫.運(yùn)行環(huán)境是vue-cli webpack 引入高德地圖 一般用使用vue-cl...
閱讀 1387·2021-11-25 09:43
閱讀 3608·2021-11-10 11:48
閱讀 5190·2021-09-23 11:21
閱讀 1613·2019-08-30 15:55
閱讀 3523·2019-08-30 13:53
閱讀 1251·2019-08-30 10:51
閱讀 883·2019-08-29 14:20
閱讀 1989·2019-08-29 13:11
