react 创建百度地图

准备工作

在百度开放平台中注册账号，并拿到ak

ak获取方式：百度开放平台==>控制台==>我的应用

安装

npm i react-bmapgl -S

引入js

在public文件夹下的index.html中引入

<script src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=您的ak码">

导入组件 使用组件

import React,{Component} from 'react';
// 导入地图组件
import {Map, Marker, NavigationControl, InfoWindow} from 'react-bmapgl';

class App extends Component {
    render() {
        return <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>
    }
}
export default App;