{"repo":"huiyan-fe/react-bmapgl","free":true,"listed":false,"github":"https://github.com/huiyan-fe/react-bmapgl","clone":"git clone https://github.com/huiyan-fe/react-bmapgl.git","description":"基于百度地图JavaScript GL版API封装的React组件库","language":"TypeScript","stars":118,"topics":["bmap","baidumap","baidu-map","react-bmap","react-baidu-map","react-baidumap","react","typescript","react-components","map"],"license":"MIT","category":"ui-components","readme_excerpt":"React-BMapGL 基于百度地图JavaScript GL版API封装的React组件库。如果想要使用旧版的2D地图的话，使用react-bmap。如果您对使用地图API完全陌生，建议使用这个库之前先了解百度地图JavaScript GL API，了解一些地图的基本概念，并申请开发者 ak 。 文档示例 官方地址：https://huiyan-fe.github.io/react-bmapgl/ 开始使用 引入脚本 首先，需要在你的 index.html 模板页面头部加载百度地图JavaScript API代码，密钥可去百度地图开放平台官网申请 然后，使用npm方式安装react组件库，然后通过es模块加载 Hello World 获取 map 实例 如果你在业务中需要操作 map 对象，需要 BMapGL.Map 实例的话，可以通过 组件实例的 map 属性访问到它。 如果你要开发 Map 的子组件，想要在子组件中获得 map 对象，可以直接在 包裹的子组件中调用 this.props.map 即可。 异步加载与按需导入 异步加载 通常，如果您的业务场景总需要使用到地图，或者需要创建多个地图实例，我们会建议您在 index.html 模板中加入JSAPI的scirpt标签，因为这种方式对后续开发没有任何限制。 但是在某些业务场景下，可能并不一定会使用到地图，且用到的地图功能、组件也相对简单，我们也提供了 MapApiLoaderHOC 高阶组件，实现异步加载的方式。 按需导入 常用的导入方法会直接把整个包导入进来 如果希望引入的包体积小一点，所有组件都支持 lodash 风格进行按需导入 本地开发 设计思想 React-BMapGL只是利用了React组件的生命周期，来调用对应的百度地图JavaScript API的方法，比如在 componentDidMount 的时候在地图上添加覆盖物， componentWillUnmount 的时候移除覆盖物， componentDidUpdate 的时候更新覆盖物，React对应的 render 渲染函数模块返回的是null。所以这里面地图相关的DOM并不是react渲染的，真正创建地图之类的还是使用百度地图JavaScript API，React-BMapGL只是利用了React组件的写法来封装百度地图JavaScript API，使我们在使用React的时候能更方便的使用百度地图JavaScript API。 Typescript支持 本项目开发使用 Typescript 编写，声明文件为 @types/bmapgl ，如果需要修改，需要给DefinitelyTyped提PR。如果需要安装声明文件依赖，执行安装命令 常用命令 发布npm包 修改 package.json 版本号后，直接执行 npm publish 许可证 MIT LICENSE","default_branch":null,"files":null,"tree":[],"storefront":"/r/huiyan-fe","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/huiyan-fe/react-bmapgl/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}