zcreativelabs / react-simple-maps

Beautiful React SVG maps with d3-geo and topojson using a declarative api.
https://www.react-simple-maps.io/
MIT License
3.04k stars 424 forks source link

Make useZoomPan initialize position on mount #229

Open raksooo opened 3 years ago

raksooo commented 3 years ago

This PR changes useZoomPan to make sure that position is initialized to the correct values on the first render, instead of the value { x: 0, y: 0, k: 1 }.

The problem with using { x: 0, y: 0, k: 1 } is that when it's used together with CSS transitions the map transitions from that value to the correct one immediately when loaded instead of just starting with the correct position without transitioning.

This PR fixes #228

I have tested this with my scenario which is a pretty simple one and it seems to work as expected but it might need some more testing in other use cases.

I hope this works well and can be merged since it would help me a lot! Let me know if anything needs to be explained or changed.