question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

onBoundsChanged or onZoom?

See original GitHub issue

I’m filtering some data based the visibility of markets in the view area (using getBounds on the markers lat/longs). I can easily do this for dragging using mapDragEnd, but is there an action related to the bounds_changed event? Or some other way to listen to viewport changes/zoom level changes?

I see actions being dynamically defined here https://github.com/fullstackreact/google-maps-react/blob/master/src/index.js#L174 but onBoundsChanged does not work.

EDIT:

Hmm, actually, I see my codebase differs from 1.0.18. My package.json says I’m on 1.0.19, and, in this version, all these events do not exist.

I added bounds_changed here:

# index.js

var evtNames = ['ready', 'click', 'dragend', 'recenter', 'bounds_changed'];

 evtNames.forEach(function (e) {
    return Map.propTypes[(0, _String.camelize)(e)] = _react.PropTypes.func;
  });

and, though the prop is called onBounds_changed, it’s working for me now. Not sure what’s up with the version numbers, but I’ll try… downgrading(?) to the latest?

Issue Analytics

  • State:open
  • Created 7 years ago
  • Comments:8

github_iconTop GitHub Comments

5reactions
michealpetersonacommented, Apr 11, 2018

All of the events are now available through the npm package but are not named what they should be. To use any of the events simply capitalize the first letter and prepend the word on. For example ‘tilesloaded’ becomes ‘onTilesloaded’, ‘bounds_changed’ becomes ‘onBounds_changed’, and so on

5reactions
lbrdarcommented, Feb 20, 2017

How is it possible that this still isn’t fixed? Even though code is correct in this repo, npm package still has old version of events even after three months?!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Events | Maps JavaScript API - Google Developers
Whenever an object's property changes, the Maps JavaScript API will fire an event that the property has changed. For example, the API will...
Read more >
OnZoom Features - Zoom Support
OnZoom has many features available to enhance the virtual event experience from registration through attendance. Use these how-to articles to learn more ...
Read more >
can't drag to move, zoom in or out google-maps-react
If I remove the onBoundsChanged property, I can drag and zoom, but if I include it, dragging and zooming doesn't work. How can...
Read more >
[Solved]-How to calculate the map span/zoom to include a set ...
... Google-Maps v3: How to change the map style based on zoom level? ... How to insert custom variable name to poerform on...
Read more >
fibery-react-calendar-timeline - npm
onZoom (timelineContext). Called when the timeline is zoomed, either via mouse/pinch zoom ... onBoundsChange(canvasTimeStart, canvasTimeEnd).
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found