我是靠谱客的博主 着急小笼包,最近开发中收集的这篇文章主要介绍react 逆地理 高德地图_react高德地图默认卫星图设置,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼

react高德地图的话组件可以会有些缺失,所以我们需要参考官网的Geocoder 的引入做参考,目前突然说需要高德地图默认卫星,react-amap,压根找不到相应的demo,所以自己花时间研究了一下

首先参考GeoCoder的写法,我们整个写入默认卫星都要做在mapevens里面,

const Map = ReactAMAP.Map

class MyApp extends React.Component{

constructor() {

super();

const _this = this;

this.state = {

status: {

zoomEnable: true

},

zoomEnable: false, // 这个配置会被 status 中的 zoomEnable 覆盖,请不要这样同时配置两者

tip: '可以缩放'

};

this.mapEvents = {

created(map){

_this.map = map;

// _this.map.setDefaultLayer(new AMap.TileLayer.Satellite());

_this.map.setLayers([new AMap.TileLayer.Satellite()]);

}

};

this.toggleZoom = this.toggleZoom.bind(this);

}

toggleZoom() {

const nextEnable = !this.state.status.zoomEnable;

const tip = nextEnable ? '缩放已启用' : '缩放已禁用' ;

this.setState({

status: {

zoomEnable: nextEnable

},

tip

});

}

render(){

return

plugins={['ToolBar']}

status={ this.state.status }

zoomEnable={this.state.zoomEnable}

events={this.mapEvents}

/>

Toggle Zoom Enable

{this.state.tip}

}

}

ReactDOM.render(, document.querySelector('#app'))

由于setDefaultLayer 已经废弃,所以采用调用setLayers,这样JS能实现的几乎在mapevens里面就能灵活调用

最后

以上就是着急小笼包为你收集整理的react 逆地理 高德地图_react高德地图默认卫星图设置的全部内容,希望文章能够帮你解决react 逆地理 高德地图_react高德地图默认卫星图设置所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(38)

评论列表共有 0 条评论

立即
投稿
返回
顶部