首页 > 解决方案 > 谷歌地图上的信息窗口不显示

问题描述

我遵循了此处发布的一些建议,但似乎无法让 InfoWindows 在地图上显示。但连标记都没有出现?但是 api 调用正在返回正确的数据..

这是我的大部分代码,减去 api 调用,这不是问题的原因。任何帮助都会很棒!提前致谢 :)

        <Map
            google={this.props.google}
            zoom={5}
            style={style}
            gestureHandling={'cooperative'}
            initialCenter={{
            lat: -19.577286,
            lng: 147.406473
            }}
        >
            {this.state.data.map((result) => {
                let keys = Object.keys(result);
                return keys.map(data => {
                    return (
                        <>
                        <Marker 
                            name={result[data].item1}
                            title={result[data].item2}
                            onClick={ this.onMarkerClick }
                            position={{
                              lat: result[data].lat,
                              lng: result[data].long
                            }}
                            animation={this.props.google.maps.Animation.DROP}
                        />
                        <InfoWindow
                            marker = { this.state.activeMarker }
                            visible = { this.state.showingInfoWindow } >

                                <div>
                                    <h4>{ this.state.selectedPlace.title }</h4>
                                    <p>{ this.state.selectedPlace.name }</p>
                                </div>

                        </InfoWindow>
                    </>
                    );
                });
            })}
        </Map>      

标签: reactjsapigoogle-maps

解决方案


推荐阅读