react-----简单使用百度地图

时间：2021-05-10 10:50:57 阅读：13 评论：0 收藏：0 [点我收藏+]

使用百度地图需要申请密钥

1.第一步申请密钥（进入下面的网站查看详情）

2.第二步添加script 标签

// 在 public/index.html 中添加
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=你申请的密钥（详情看第一步）"></script>

3.第三步初始化地图

import React from "react";

import "./index.scss";

// 解决脚手架中全局变量访问的问题

const BMap = window.BMap;

class Map extends React.Component {

componentDidMount() {

this.getMap();

}

getMap = () => {

// 创建地图实例

var map = new BMap.Map("container");

// 创建点坐标

var point = new BMap.Point(116.404, 39.915);

// 初始化地图，设置中心点坐标和地图级别

map.centerAndZoom(point, 15);

//开启鼠标滚轮缩放

map.enableScrollWheelZoom(true);

};

render() {

return (

// 父容器高度都要设置

</div>

);

}

export default Map;

原文：https://www.cnblogs.com/panstarry/p/14749898.html

踩

(0)

评论一句话评论（0）

分享档案

更多>