0

我知道这个主题有很多问题，但我找不到答案......我使用 Next.js，我想在我的网站上显示带有标记的地图。我为此使用 google-map-react。谷歌地图的功能是显示而不是内容，我不知道为什么。我有一个键，标记的文本是显示的，但不是地图。他们没有错误......有人可以帮助我吗？

图片

在这里你可以看到我的代码：

import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';

const AnyReactComponent = ({ text }) => <div>{text}</div>;

class Map extends Component {
  static defaultProps = {
    key: {key:'A.................Q'},
    center: {
      lat: 48.04,
      lng: 7.55
    },
    zoom: 8
  };

  render() {
    return (
        <div style={{ height:"500px", width:"500px" }}>
            <div style={{ height: '400px', width: '400px' }}>
                <GoogleMapReact
                bootstrapURLKeys={this.props.key}
                defaultCenter={this.props.center}
                defaultZoom={this.props.zoom}
                >
                <AnyReactComponent
                    lat={48.042145297679944}
                    lng={7.545328618777818}
                    text="PS-Web"
                />
                </GoogleMapReact>
            </div>

        </div>
    );
  }
}

export default Map;
4

0 回答 0