我如何用谷歌地图在react中制作一个静态地图

Question

我有这个：

<GoogleMapReact
bootstrapURLKeys={{ key: 'key' }}
defaultCenter={center}
defaultZoom={zoom}
>
<TacoMarker
link={shop.id}
lat={latitude}
lng={longitude}
/>
</GoogleMapReact>

我能递给你什么道具？它会像scrollEnabled＝｛false｝吗？

Answer 1

google-map-react是为使用Maps JavaScript API而编写的。请注意，Maps JavaScript API与Maps Static API不同。如果您想在react代码中显示静态映射，您可以直接将Maps static API URL放在<img/>标记的src参数中。

下面是一个示例代码片段：

import React from "react";
import ReactDOM from "react-dom";
function App() {
return (
<div>
<h1>Static Maps Sample</h1>
<img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY"/>   
</div>
);
}
ReactDOM.render(<App />, document.getElementById("root"));