-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Feature/map #20
base: master
Are you sure you want to change the base?
Feature/map #20
Conversation
Merge remote-tracking branch 'origin/master' into feature/map
const myLatLng = {lat: -25.363, lng: 131.044}; | ||
|
||
// Create a map object and specify the DOM element for display. | ||
this.props.googleMap = new google.maps.Map(this.refs.map, { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this._map = ...
.
|
||
updateMap = () => { | ||
const map = this.props.googleMap; | ||
this.props.posts.map((post) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use .forEach()
instead of .map()
} | ||
|
||
updateMap = () => { | ||
const map = this.props.googleMap; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Remove
this.props.posts.map((post) => { | ||
const { latitude, longitude } = post.location; | ||
const marker = new google.maps.Marker({ | ||
map: map, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
map: this._map
|
||
componentDidUpdate(prevProps) { | ||
if (!prevProps.mapsLoaded && this.props.mapsLoaded) this.initMap(this.props.posts); | ||
if (this.props.posts.length > 0) this.updateMap(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
import { isEqual, property } from 'lodash-es';
// ...
if (!isEqual(this.props.posts.map(property('id')), prevProps.posts.map(property('id'))) this.updateMap();
const map = this.props.googleMap; | ||
this.props.posts.map((post) => { | ||
const { latitude, longitude } = post.location; | ||
const marker = new google.maps.Marker({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You probably don't want to keep re-adding points. Think about a way to keep track of existing points, or alternatively clear the map, and re-add.
|
||
// Create a map object and specify the DOM element for display. | ||
this.props.googleMap = new google.maps.Map(this.refs.map, { | ||
center: myLatLng, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Remember, you already have access to the user's location (this.props.location
)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
But at this point we don't, it's retrieved afterwards
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Then we should probably have some logic to create the map only once the script has loaded, and we have the user's location.
No description provided.