小编Gay*_*hne的帖子

在 google-map-react 上动态添加标记

我不想做的是在地图上显示从某些移动设备中选择的位置。有关位置的数据在那里..

我在这里需要的是根据从服务器收到的数据在地图上添加标记。

假设我已将位置数据({Lat,Lang})设置为状态标记, 那么如何将其添加到地图中。

我的地图代码如下!

import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';

const AnyReactComponent = ({ text }) => <div>{text}</div>;

class MyClass extends Component {
  constructor(props){
    super(props);

  }

  render() {
    return (
      <GoogleMapReact
        defaultCenter={this.props.center}
        defaultZoom={this.props.zoom}
        style={{height: '300px'}}
      >
        <AnyReactComponent
          lat={59.955413}
          lng={30.337844}
          text={'Google Map'}
        />
      </GoogleMapReact>
    );
  }
}
MyClass.defaultProps = {
  center: {lat: 59.95, lng: 30.33},
  zoom: 11
};

export default MyClass;
Run Code Online (Sandbox Code Playgroud)

这段代码来自答案Implementing google maps with react

使用的 npm 包:- google-map-react

javascript google-maps reactjs

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

google-maps ×1

javascript ×1

reactjs ×1