reactjs - 如何使用 react-google-maps 禁用街景？

Question

我正在使用 react-google-maps 包在我的 react 应用程序中呈现 Google map 。我想禁用街景。

从 the documentation ，我看到有以下 Prop :

defaultStreetView

街景

我曾尝试将两者与 false 一起使用 - 但都不起作用。有谁知道如何通过这个包禁用街景功能？

代码片段在这里:

import React, { Component } from 'react';
import { withScriptjs, withGoogleMap, GoogleMap, Marker } from "react-google-maps";
import PropTypes from 'prop-types';

const Map = withScriptjs(withGoogleMap((props) => {
    return(
        <GoogleMap 
            defaultZoom={17}
            defaultCenter={{ lat: props.lat, lng: props.lng }}
            // defaultStreetView={false}
            // streetView={false}
        >
            {props.isMarkerShown && <Marker position={{ lat: props.lat, lng: props.lng }} />}
        </GoogleMap>
    )
}))

Map.propTypes = {
    lat: PropTypes.number.isRequired,
    lng: PropTypes.number.isRequired,
    isMarkerShown: PropTypes.bool.isRequired
}

export default Map;

Answer 1

在这种情况下，似乎 Prop defaultStreetView 和 streetView 实际上并不相关。

实现这一点的方法是将 { streetViewControl: false } 传递给 options Prop 。

正确代码:

import React, { Component } from 'react';
import { withScriptjs, withGoogleMap, GoogleMap, Marker } from "react-google-maps";
import PropTypes from 'prop-types';

const Map = withScriptjs(withGoogleMap((props) => {
    return(
        <GoogleMap 
            defaultZoom={17}
            defaultCenter={{ lat: props.lat, lng: props.lng }}
            options={{streetViewControl: false}}
        >
            {props.isMarkerShown && <Marker position={{ lat: props.lat, lng: props.lng }} />}
        </GoogleMap>
    )
}))

Map.propTypes = {
    lat: PropTypes.number.isRequired,
    lng: PropTypes.number.isRequired,
    isMarkerShown: PropTypes.bool.isRequired
}

export default Map;