我的反應應用程式中有一個 map.jsx 檔案，其中包含以下代碼：
import React from 'react';
import GoogleMapReact from 'google-map-react';
import './map.css';
const Map = ({ location, zoomLevel }) => (
<div className='map'>
<div className='google-map'>
<GoogleMapReact
bootstrapURLKeys={{ key: 'keyID' }}
defaultCenter={location}
defaultZoom={zoomLevel}></GoogleMapReact>
</div>
</div>
);
export default Map;
然后從我的主頁檔案“chatApp.jsx”中呼叫該組件，以便在螢屏上顯示地圖：
import React, { useEffect, useRef, useState } from 'react';
import { useParams } from 'react-router-dom';
import MapSection from '../components/map/Map';
const location = {
address: 'House',
lat: 53.123,
lng: -2.123,
};
export const ChatPage = () => {
return (
<main className='chat-wrapper'>
<MapSection location={location} zoomLevel={18} /> {/* include it here */}
</main>
);
};
我的問題是：如何阻止地圖被拖動/滾動和移動？我希望它不斷地放在一個地方，影像在它的頂部。有沒有辦法在這段代碼中引入界限？
uj5u.com熱心網友回復：
我意識到我只需要將它添加到谷歌地圖引數中：
options={{ gestureHandling: 'none'}}
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/429742.html
標籤：javascript css 反应 谷歌地图
下一篇：如何在GoogleCloudFunction中將非默認Google服務帳戶憑據與SecretManagerService一起使用？