Skip to content
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

fix markers rerender when click to open InfoWindow #310

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

deadkff01
Copy link

@deadkff01 deadkff01 commented Jan 28, 2019

Solving issue #269

In Marker.js componentDidUpdate()

this.props.position and prevProps.position will never be equal after component is fully rendered in first time, because these properties are objects, for this reason I use the lat and lng to compare after the first rendering.

@m-bartenev
Copy link

@deadkff01 , I came across that issue recently. I did the same comparison but in shouldComponentUpdate method. Can I ask you why you've opted to the componentDidUpdate?
Thanks

@deadkff01
Copy link
Author

@m-bartenev, I did the comparison in componentDidUpdate only to keep the same code structure. :)

@m-bartenev
Copy link

@deadkff01 , I see :) Thank you for your answer!

@srobertson421
Copy link

To anyone who comes across this bug, here is a patch you can use until things are merged, should stop the constant re-renders:

class CustomMarker extends Marker {
  componentDidUpdate(prevProps) {
    if(
      this.props.map !== prevProps.map || 
      this.props.icon.url !== prevProps.icon.url || 
      (
        this.props.position.lat !== prevProps.position.lat || 
        this.props.position.lng !== prevProps.position.lng
      )
    ) {
      if(this.marker) {
        this.marker.setMap(null);
      }
      this.renderMarker();
    }
  }
}

@deadkff01
Copy link
Author

Nice @srobertson421

@@ -36,7 +36,9 @@ export class Marker extends React.Component {

componentDidUpdate(prevProps) {
if ((this.props.map !== prevProps.map) ||
(this.props.position !== prevProps.position) ||
((this.props.position && prevProps.position)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

most unreadable, please rather use a function such as 'arePositionsEqual' to simplify readability. thank you

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, it's been a long time, I'll see if this change still makes sense, if so, I'll make the change later.
Thanks for the feedback.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The problem still persists in the current version of the lib.

I solved your issue in the last commits.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants