изменить курсор на указатель Google-карты-реагировать

Question

Я использую Google-карты-реагировать .По умолчанию, когда я помещаю мышь на карту, она показывает курсор в виде руки.Я хотел бы установить нормальный указатель, когда человек наводит курсор на карту, и только при начале перетаскивания курсор снова становится ручным курсором.

Я пытался установить draggableCursos опору во многих отношениях, но я этого не сделалполучить то, что я хотел.

Спасибо заранее за помощь.

Answer 1

Похоже, что текущая версия (2.0.2) пакета google-maps-react, опубликованного в npm, не поддерживает указание нескольких свойств, включая MapOptions.draggableCursor и MapOptions.draggingCursor черезКомпонент карты.В таких случаях эти свойства могут быть указаны через собственный объект карты.Следующий пример демонстрирует это

class MapContainer extends React.Component {
  constructor(props) {
    super(props);
    this.handleMapReady = this.handleMapReady.bind(this);
  }

  handleMapReady(mapProps,map) {
    map.setOptions({
      draggableCursor: "default",
      draggingCursor: "pointer"
    });
  }



  render() {
    return (
      <div className="map-container">
        <Map
          google={this.props.google}
          className={"map"}
          zoom={this.props.zoom}
          initialCenter={this.props.center}
          onReady={this.handleMapReady}
        />
      </div>
    );
  }
}

Вот демоверсия

Answer 2

Вы можете добавить пользовательское имя класса на карту и прикрепить событие, которое изменит свойство CSS pointer-events на карте.