在React / google-maps-react组件上从Web API设置地图的初始中心

npm install google-maps-react

import React, { Component } from 'react';
import { Map, GoogleApiWrapper, Marker } from 'google-maps-react';

class MapContainer extends Component {
  render() {
    const mapStyles = {
      width: '100%',
      height: '400px',
    };

    const initialCenter = { lat: 37.7749, lng: -122.4194 }; // 设置地图的初始中心为旧金山

    return (
      <Map
        google={this.props.google}
        zoom={14}
        style={mapStyles}
        initialCenter={initialCenter}
      >
        <Marker position={initialCenter} />
      </Map>
    );
  }
}

export default GoogleApiWrapper({
  apiKey: 'YOUR_GOOGLE_MAPS_API_KEY', // 请替换为你的Google Maps API密钥
})(MapContainer);