react-google-maps/api 不再需要按住 ctrl 进行缩放
react-google-maps/api Remove need to hold ctrl to zoom
我已经使用 react-google-maps/app 在我的 React 应用程序中设置了一张地图,但有些事情让我很烦。要使用滚轮缩放地图,您必须按住控制键。有没有一种方法可以禁用它,这样我就可以在不控制的情况下进行缩放。有办法吗?
这是我的地图代码:
class MapContainer extends React.Component {
render() {
return (
<>
<LoadScript googleMapsApiKey="API-KEY" >
<GoogleMap
zoom={14}
mapContainerStyle={{width: window.innerWidth, height: window.innerHeight}}
// Using placeholder lat/lng coords here, they're real in my actual code
center={{
lat: 0.00000000,
lng: 0.00000000
}}
onClick={(e) => {console.log(`${e.latLng.lat()} ${e.latLng.lng()}`)}}
>
</GoogleMap>
</LoadScript>
</>
)
}
}
在查看了 google 地图 javascript API 的文档后,我发现您可以使用 GoogleMap 组件的 options
道具来做到这一点,并且将 gestureHandling
设置为 greedy
,像这样:
<GoogleMap
options={{
gestureHandling: "greedy"
}}
>
</GoogleMap>
我已经使用 react-google-maps/app 在我的 React 应用程序中设置了一张地图,但有些事情让我很烦。要使用滚轮缩放地图,您必须按住控制键。有没有一种方法可以禁用它,这样我就可以在不控制的情况下进行缩放。有办法吗?
这是我的地图代码:
class MapContainer extends React.Component {
render() {
return (
<>
<LoadScript googleMapsApiKey="API-KEY" >
<GoogleMap
zoom={14}
mapContainerStyle={{width: window.innerWidth, height: window.innerHeight}}
// Using placeholder lat/lng coords here, they're real in my actual code
center={{
lat: 0.00000000,
lng: 0.00000000
}}
onClick={(e) => {console.log(`${e.latLng.lat()} ${e.latLng.lng()}`)}}
>
</GoogleMap>
</LoadScript>
</>
)
}
}
在查看了 google 地图 javascript API 的文档后,我发现您可以使用 GoogleMap 组件的 options
道具来做到这一点,并且将 gestureHandling
设置为 greedy
,像这样:
<GoogleMap
options={{
gestureHandling: "greedy"
}}
>
</GoogleMap>