diff --git a/packages/plugins/blocks/blocks-google-maps/src/blocks/Map.js b/packages/plugins/blocks/blocks-google-maps/src/blocks/Map.js index 09f2485357..a1313bb8de 100644 --- a/packages/plugins/blocks/blocks-google-maps/src/blocks/Map.js +++ b/packages/plugins/blocks/blocks-google-maps/src/blocks/Map.js @@ -39,15 +39,16 @@ const Map = ({ blockId, children, content, methods, properties }) => { useEffect(() => { methods.registerMethod('fitBounds', (args) => { - if (type.isArray(args)) { - args.map((arg) => { - bounds.extend(arg); - }); - } - if (type.isObject(args)) { - bounds.extend(args); + if (!bounds || !map) { + throw new Error('fitBounds can only be called once google maps has been mounted.'); } + (args?.bounds ?? []).map((position) => { + bounds.extend(position); + }); map.fitBounds(bounds); + if (args.zoom) { + map.setZoom(args.zoom); + } }); }, [bounds, map]); @@ -71,9 +72,13 @@ const Map = ({ blockId, children, content, methods, properties }) => { mapContainerClassName={methods.makeCssClass([STYLE_DEFAULTS, properties.style])} center={properties.map?.center ?? MAP_DEFAULTS.center} zoom={properties.map?.zoom ?? MAP_DEFAULTS.zoom} - onLoad={(map) => { + onLoad={(map, event) => { setMap(map); setBounds(new window.google.maps.LatLngBounds()); + methods.triggerEvent({ + name: 'onLoad', + event, + }); }} onClick={(event) => { methods.triggerEvent({