如何使用原生react更改GoogleMap标记别针和点颜色

import React from 'react';
import { GoogleMap, Marker } from 'react-google-maps';

class MapComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      markers: [
        { lat: 37.7749, lng: -122.4194, color: 'red' },
        { lat: 37.3382, lng: -121.8863, color: 'blue' },
        // 添加更多标记...
      ]
    };
  }

  render() {
    return (
      <GoogleMap
        defaultZoom={10}
        defaultCenter={{ lat: 37.7749, lng: -122.4194 }}
      >
        {this.state.markers.map((marker, index) => (
          <Marker
            key={index}
            position={{ lat: marker.lat, lng: marker.lng }}
            icon={{
              url: `https://maps.google.com/mapfiles/ms/icons/${marker.color}-dot.png`,
              scaledSize: new window.google.maps.Size(32, 32)
            }}
          />
        ))}
      </GoogleMap>
    );
  }
}

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>

ReactDOM.render(<MapComponent />, document.getElementById('root'));