map地圖組件使用時直接在template中使用<map></map>標(biāo)簽满俗，標(biāo)簽中可嵌套map屬性
map最常用到的屬性：
????longitude? 中心經(jīng)度
????latitude 中心緯度
????scale 縮放級別（取值范圍為5-18,默認(rèn)的是16 ，值數(shù)越大，放大程度越大程储，看的越細(xì)）
????markers? 標(biāo)記點(diǎn)? （類型為Array數(shù)組配喳，在地圖上標(biāo)記出來的點(diǎn)）
? ??polyline（類型為Array數(shù)組憔狞，沒有默認(rèn)值蹂安，表示路線椭迎，數(shù)組上的所有點(diǎn)連成線）
????circles（類型Array數(shù)組，表示圓）
????controls（類型Array數(shù)組田盈，表示控件）
????include-points（類型Array數(shù)組侠碧，表示縮放視野已包含所有給定的坐標(biāo)點(diǎn)）
????enable-3D（類型為Boolean，默認(rèn)值為false缠黍，表示是否顯示3D摟塊）
????show-compass（類型為Boolean，默認(rèn)值為false药蜻，表示為是否顯示指南針）
????enable-overlooking（類型為Boolean瓷式，默認(rèn)值為false替饿，表示為是否開啟俯視）
????enable-satellite（類型為Boolean，默認(rèn)值為false贸典，表示為是否開啟衛(wèi)星圖）
????enable-traffic（類型為Boolean视卢，默認(rèn)值為false，表示為是否開啟實(shí)時路況）
????show-location（類型為Boolean廊驼，表示顯示帶有方向的當(dāng)前定位點(diǎn)）
????polygons（類型Array据过，表示為多邊形）
markers的屬性有（表示標(biāo)記點(diǎn)用于在地圖上顯示標(biāo)記的位置）
? ??id：標(biāo)記點(diǎn)id(marker點(diǎn)擊事件回調(diào)會返回此id)
????latitude：緯度（范圍 -90 ~ 90 ）
????longitude：經(jīng)度（范圍 -180 ~ 180 ）
????title：標(biāo)注點(diǎn)名
????iconPath：顯示的圖標(biāo)
????rotate：旋轉(zhuǎn)角度（順時針旋轉(zhuǎn)的角度，范圍 0 ~ 360妒挎，默認(rèn)為 0 ）
????alpha：標(biāo)注的透明度（ 默認(rèn)1绳锅，無透明，范圍 0 ~ 1）
????width：標(biāo)注圖標(biāo)寬度（默認(rèn)為圖片實(shí)際寬度 ）
????height：標(biāo)注圖標(biāo)高度（默認(rèn)為圖片實(shí)際高度 ）
????callout：自定義標(biāo)記點(diǎn)上方的氣泡窗口
????label：為標(biāo)記點(diǎn)旁邊增加標(biāo)簽
????anchor：經(jīng)緯度在標(biāo)注圖標(biāo)的錨點(diǎn)
? ? ?callout的屬性有
? ??????????content：文本
????????????color：文本顏色
????????????fontSize：文字大小
????????????borderRadius：callout邊框圓角
????????????bgColor：背景色
????????????padding：文本邊緣留白
????????????display：BYCLICK':點(diǎn)擊顯示;'ALWAYS':常顯
????????????textAlign：文本對齊方式
? ??label的屬性有
? ??????????content：文本??
????????????color：文本顏色
????????????fontSize：文字大小
????????????x：label的坐標(biāo)酝掩，原點(diǎn)是 marker 對應(yīng)的經(jīng)緯度
????????????y：label的坐標(biāo)鳞芙，原點(diǎn)是 marker 對應(yīng)的經(jīng)緯度
????????????borderWidth：邊框?qū)挾?/p>
????????????borderColor：邊框顏色
????????????borderRadius：callout邊框圓角
????????????bgColor：背景色
????????????padding：文本邊緣留白
????????????textAlign：文本對齊方式
polyline的屬性有（表示指定一系列坐標(biāo)點(diǎn)，從數(shù)組第一項(xiàng)連線至最后一項(xiàng)）
????points期虾，經(jīng)緯度數(shù)組原朝，類型為Array，必填镶苞，如：[{latitude: 0, longitude: 0}]
????color喳坠，線的顏色，類型為String茂蚓，不必填壕鹉，如：#0000AA
????width，線的寬度煌贴，類型為Number御板，不必填
????dottedLine，是否虛線牛郑，類型為Boolean怠肋，不必填，默認(rèn)值false
????arrowLine淹朋，帶箭頭的線笙各，類型為Boolean，不必填础芍，默認(rèn)值為false
????arrowIconPath杈抢，更換箭頭圖標(biāo)，類型為String仑性，不必填惶楼，在arrowLine為true時，默認(rèn)帶箭頭的線時生效
????borderColor，線的邊框顏色歼捐，類型為String何陆，不必填
????borderWidth，線的厚度豹储，類型為Number贷盲，不必填
circles 的屬性有（在地圖上顯示圓）
????latitude，緯度剥扣，Number巩剖，必填，浮點(diǎn)數(shù)钠怯，范圍 -90 ~ 90
????longitude佳魔，經(jīng)度，Number呻疹，必填吃引，浮點(diǎn)數(shù)，范圍-180 ~ 180
????color刽锤，描邊的顏色镊尺，String，不必填并思，如：#0000AA
????fillColor庐氮，填充顏色，String宋彼，不必填弄砍，如：#0000AA
????radius，半徑输涕，Number音婶，必填
????strokeWidth，描邊的寬度莱坎，Number衣式，不必填
controls 控件 (在地圖上顯示一個控件，但是這個控件并不隨著地圖移動)
????id：控件id(在控件點(diǎn)擊事件回調(diào)會返回此id)
????position：控件在地圖的位置(控件相對地圖位置)
????iconPath：顯示的圖標(biāo)(項(xiàng)目目錄下的圖片路徑)
????clickable：是否可點(diǎn)擊(默認(rèn)不可點(diǎn)擊)
附上我自己的代碼
html部分
<map style="width: 100%; height: 424rpx;"? enable-3D="false" show-compass="false" enable-overlooking="false" :enable-satellite="false" :enable-traffic="false" show-location="false" :latitude="latitude" :longitude="longitude" :markers="covers"> </map>
js部分：
data() {
return {
????latitude: 39.899,
????longitude: 116.39742,
????covers:[{
????????????id: 1, // Number
????????????title: '', // String-標(biāo)注點(diǎn)名
????????????rotate: 0, // Number - 順時針旋轉(zhuǎn)的角度檐什，范圍 0 ~ 360碴卧，默認(rèn)為 0
????????????alpha: 1, // 默認(rèn)1，無透明乃正，范圍 0 ~ 1
????????????latitude: 39.899,
????????????longitude: 116.39742,
????????????width: 30,
????????????height: 30,
????????????callout: { //自定義標(biāo)記點(diǎn)上方的氣泡窗口 點(diǎn)擊有效?
????????????????????????content: '硅谷廣場B座', //文本
????????????????????????color: '#333', //文字顏色
? ? ? ? ? ? ? ? ? ? ? ? ?fontSize: 14, //文本大小
????????????????????????borderRadius: 10, //邊框圓角
? ? ? ? ? ? ? ? ? ? ? ? bgColor: '#fff', //背景顏色
????????????????????????display: 'ALWAYS', //常顯
????????????????????????padding:10
????????????},
????????????// anchor: {},
????????????iconPath: '/static/home/dibiao.png', // 顯示的圖標(biāo)
????????}]
????};
},
