摘要:更多關(guān)于的操作請(qǐng)查看騰訊地圖官網(wǎng)戳我簡(jiǎn)單的封裝了一塊原石,封裝還在繼續(xù),如果老鐵有更好的方式或想法不妨走起一波會(huì)給你雙擊如果有問(wèn)題可加入前端交流群一起討論前端攻城獅群
react-qmap -- React騰訊地圖組件 一個(gè)對(duì)騰訊web地圖簡(jiǎn)單封裝的React組件
GitHub源碼地址:戳我
栗子:戳我
栗子源碼:戳我
安裝
yarn add react-qmap or npm install react-qmap
基礎(chǔ)用法
import ReactQMap from "react-qmap";API
Method | Type | Optional | Default | Description |
---|---|---|---|---|
getMap | function | false | 獲取地圖的對(duì)象和當(dāng)前容器的map對(duì)象,第一個(gè)參數(shù)是new的當(dāng)前map對(duì)象,第二個(gè)參數(shù)是全局map對(duì)象 | |
style | object | false | 設(shè)置組件的內(nèi)聯(lián)樣式,默認(rèn)樣式width: "100%", height: "100%" | |
className | string | false | 設(shè)置組件的class | |
mySpot | object | false | 設(shè)置地圖的定位坐標(biāo) | |
initialOptions | object | false | zoom: 14,disableDefaultUI: true, zoomControl: false,mapTypeControl: false, | 初始化地圖的參數(shù),簡(jiǎn)單默認(rèn)設(shè)置了幾個(gè),更多的初始化參數(shù)請(qǐng)參照文檔 |
apiKey | string | true | 設(shè)置地圖引用的key,為防止限制調(diào)用API,建議官網(wǎng)申請(qǐng)自己的key | |
center | object | true | 設(shè)置地圖初始化的中心位置坐標(biāo) |
有了初始化的地圖,獲取到地圖對(duì)象之后,就可以按照官網(wǎng)提供的資料隨心所欲了。
更多關(guān)于API的操作請(qǐng)查看騰訊地圖官網(wǎng)(戳我)
簡(jiǎn)單的封裝了一塊原石,封裝還在繼續(xù),如果老鐵有更好的方式或想法不妨PR走起一波~會(huì)給你雙擊666
如果有問(wèn)題可加入前端交流群一起討論:前端攻城獅②群:592688854
licenseMIT
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/51945.html
摘要:更多關(guān)于的操作請(qǐng)查看騰訊地圖官網(wǎng)戳我簡(jiǎn)單的封裝了一塊原石,封裝還在繼續(xù),如果老鐵有更好的方式或想法不妨走起一波會(huì)給你雙擊如果有問(wèn)題可加入前端交流群一起討論前端攻城獅群 react-qmap -- React騰訊地圖組件 一個(gè)對(duì)騰訊web地圖簡(jiǎn)單封裝的React組件 GitHub源碼地址:戳我 栗子:戳我 栗子源碼:戳我 showImg(https://segmentfault.c...
閱讀 1392·2021-10-19 11:42
閱讀 731·2021-09-22 16:04
閱讀 1882·2021-09-10 11:23
閱讀 1862·2021-07-29 14:48
閱讀 1261·2021-07-26 23:38
閱讀 2821·2019-08-30 15:54
閱讀 1037·2019-08-30 11:25
閱讀 1704·2019-08-29 17:23