react如何使用百度地图

使用百度地图之前,我们需要提前做好准备工作:先注册好百度地图,然后就开始

找到并打开开发文档 进入React-BMapGL 打开后React-BMapGL的页面

  1. 在public中的index.html引入脚本,填入自己的密钥
//您的密钥中 填入自己的密钥
<script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=您的密钥"></script>

2.使用npm方式安装react组件库,然后通过es模块加载

npm install react-bmapgl --S

3.导入组件

import {Map, Marker, NavigationControl, InfoWindow} from react-bmapgl;

4.使用组件

<Map center={
         
  {lng: 116.402544, lat: 39.928216}} zoom="11">
            <Marker position={
         
  {lng: 116.402544, lat: 39.928216}} />
            <NavigationControl /> 
            <InfoWindow position={
         
  {lng: 116.402544, lat: 39.928216}} text="内容" title="标题"/>
        </Map>

到这地图都可以显示了,如果想要做各种功能,可以在api中查找使用

经验分享 程序员 微信小程序 职场和发展