reactjs - 使用谷歌地图的api设置动态中心
问题描述
class SimpleMap extends Component {
constructor(props) {
super(props);
}
static defaultProps = {
center: {lat: 40.73, lng: -73.93},
zoom: 12
}
render() {
return (
<div style={{ height: '100vh', width: '100%' }}>
<GoogleMapReact
bootstrapURLKeys={{ key: API_KEY}}
defaultCenter={this.props.center}
defaultZoom={5}
>
<AnyReactComponent
lat={this.props.lat}
lng={this.props.long}
text=" the ISS"
/>
</GoogleMapReact>
</div>
);
}
}
export default SimpleMap;
我有一个由 API 提供的位置,我希望通过以我在父节点上的经纬度坐标为中心在谷歌地图上显示该位置。当我将静态 defaultProps 更改为使用道具“this.props.lat/long”时,除非我硬编码我的纬度和经度,否则它不会渲染地图。
任何意见,将不胜感激
解决方案
推荐阅读
- python - 加载 joblib ML 模型并使用 pyinstaller 导出
- javascript - 将 null 与 null 进行比较时的意外行为
- haskell - 如何将延续单子分解为左右伴随?
- java - 将一个摆动组件与另一个关联
- r - 如何添加具有特定计算的列并根据 R 中的计算绘制图表?
- python - 调整矩阵,人脸识别
- java - 创建 CustomButton 将 Button 扩展为在 onclick 之前调用的预设条件
- mysql - 如何在同一个选择中以两种不同的方式计算?
- javascript - 为什么不渲染组件子项?
- c++ - 如何返回图中 2 个节点之间所有可能路径的二维数组?(C++)