做了個項目是公司的官網，有個頁面要求是嵌入地圖，在地圖上標記出公司
成果是這種
之前沒有做過關於地圖的 ，在找辦法的時候 還直接去找高德官方api，后來發現只需要一個插件react-amap，這個插件也有官方文檔
詳情見https://elemefe.github.io/react-amap/components/about
首先npm install --save react-amap(如果裝了cnpm也可以用)
react-amap包含地圖，覆蓋物，信息窗體3類組件，這是官方文檔的大概的介紹
在這里我使用的是InfoWindow組件
頁面代碼如下
首先要引入
import {Map,InfoWindow} from 'react-amap';（如果你需要其他的標記比如Marker，也就直接引入就行了，Map是一定要的，因為其他的組件都是要作為Map的子組件去使用的，也就是要Map包裹的），看代碼
position和center都是你目的地的經緯度，
position的意思是定位到這個經緯度，
center是在頁面展示中，會以這個經緯度為中心散開，效果圖上也可以看得出來，如果不寫center，可能會出現，標記點在比較偏的位置（比如左下右下）
offset是 那個信息窗體相對於標記點也就是設置的經緯度的位置，size是信息窗體的大小。
如果你的信息窗體需要顯示多行文字
可以直接寫標簽的 什么p標簽
b標簽 h123456標簽
提一嘴如果不知道目標地點的經緯度 ，網頁打開高德地圖，屏幕最下方點 開放平台→開發支持→地圖工具→坐標拾取器 如圖
好了 這篇分享就到這里，希望對大家有幫助。
2021-08-23
后來我發現用這個插件 手機端的地圖加載不出來。。。只有PC端可以
於是改用原生js
更多寫法見官網https://elemefe.github.io/react-amap/components/about