Search code examples
angulartypescriptmapshere-apiheremaps

Here Maps API - group.getBoundingBox is not a function


Trying to group map Markers then focus and zoom on the group.

I have followed the Docs: Zooming to a Set of Markers

script

    public viewGroupMarkers() {
        // CREATE MARKERS
        const toronto = new H.map.Marker({lat:43.7,  lng:-79.4});
        const boston = new H.map.Marker({lat:42.35805, lng:-71.0636});
        const washington = new H.map.Marker({lat:38.8951, lng:-77.0366});
        // CREATE GROUP
        const group = new H.map.Group();
        group.addObjects([toronto, boston, washington]);
        // ADD GROUP TO MAP
        this.map.addObject(group);
        // GET VIEW BOUND GROUP
        this.map.getViewModel().setLookAtData({
          bounds: group.getBoundingBox()
        });
      }

...but when trying to group.getBoundingBox I get an error:

core.js:6479 ERROR TypeError: group.getBoundingBox is not a function
    at HereMapsComponent.viewGroupMarkers (here-maps.component.ts:286:21)
    at TripMapComponent.setGroupViewBounds (trip-map.component.ts:91:28)
    at CardMapTripComponent.setMarkers (card-map-trip.component.ts:30:18)
    at CardMapTripComponent_Template_app_trip_map_isReady_15_listener (template.html:28:11)
    at executeListenerWithErrorHandling (core.js:15307:1)
    at Object.wrapListenerIn_markDirtyAndPreventDefault [as next] (core.js:15345:1)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183:1)
    at SafeSubscriber.next (Subscriber.js:122:1)
    at Subscriber._next (Subscriber.js:72:1)
    at Subscriber.next (Subscriber.js:49:1)

Solution

  • getBoundingBox method was introduced in Group object in the latest (3.1) version of API.

    I think you still load legacy 3.0 API.

    You have two options:

    1. Migrate to version 3.1 (recommended). This migration guide should help you to switch to version 3.1.
    2. change method to getBounds()