1
現在、ReactとGoogleマップを使用しているプロジェクトで作業していますが、Googleマップはレンダリングされていません。私はgoogle-maps-reactライブラリを使用していますが、「Loading map ...」と表示されますが、それ以上のことはありません。また、このライブラリのデフォルトの中心を設定できる方法があるかどうか不思議です。ここでGoogleマップが反応してレンダリングされない
は私のGoogleマップコード..です
import React, {PropTypes, Component} from 'react';
import Map, { Marker } from 'google-maps-react';
export default class GoogleMap extends Component {
render() {
return (
<Map google={this.props.google}
style={{width: '100%', height: '100%', position: 'relative'}}
zoom={10}>
</Map>
);
}
}
、ここでは私のindex.js
あるimport React, { Component } from 'react';
import ReactDOM from 'react-dom';
import axios from 'axios';
import _ from 'lodash';
import TruckList from './components/truck_list';
import GoogleMap from './components/google_map';
const url = `https://data.sfgov.org/resource/6a9r-agq8.json`;
const truckArr = [];
class App extends Component {
constructor(props) {
super(props);
const self = this;
self.state = { truckArr: [] };
axios.get(url)
.then((truckList) => {
_.forEach(truckList.data, (truck) => {
truckArr.push(truck);
});
self.setState({ truckArr });
});
}
render() {
return (
<div className="app">
<GoogleMap />
<TruckList list={this.state.truckArr}/>
</div>
);
}
};
ReactDOM.render(<App/>, document.querySelector('.container'));
私は前方に移動することができるように、この最初のステップを完了する必要がありますが、これ以来、私の最初にReactとGoogleマップを使用して、私は自分の道を見つけるのに困っている。
誰かが私に何をする必要があるかを伝えることができれば、それは素晴らしいことです。 GoogleマップAPIスクリプトをロードする必要があるため、事前
OMGにグローバル
googleオブジェクトを注入して、スクリプトを含めるゲット働く本当にありがとう！！ – ckim16