CODEWITHSUNDEEP
here-api
Vcitor
Vcitor

Reputation: 21

Here api, javascript 3.0

Using this example: https://developer.here.com/api-explorer/maps-js/infoBubbles/open-infobubble . I have a new map with two points.If I change the div of map adding width:100%;height:100% and position:absolute. I have a full screen map, but in this versión if i load the first time the page without full screen and a click a full screen windows i have a grey backgroud color. The same issue with a movile browswer when change the screen orientation. In the other API it didnt happened, all time the map is in full screen. ¿How can i fix it? And the other question in this api, how i can close a infobubbles ??.

Regards and sorry for my english.

Upvotes: 0

Views: 429

Answers (1)

Graeme Skinner
Graeme Skinner

Reputation: 61

If I understand you correctly...

When you change the size of the map's container you need to call a refresh to the map.

For example - create your map:

var map = new H.Map(
  document.getElementById(map_div),
  defaultLayers.normal.map,
  {
    zoom: 4,
    center: { lat: 45.3367, lng: -95.4492 },
  });

Then add a listener for a window resize:

window.addEventListener('resize', function () {
  map.getViewPort().resize();
});

Or call the resize method whenever you change the size of your div map container.

As for dealing with closing info bubbles, I am assuming you already have your HERE Maps UI object setup for adding/showing info bubbles.

To close the open one use the HERE Maps UI object:

ui.removeBubble(bubble);

if your issue is keeping track of what is currently open, trying assigning it to a script wide variable anytime you add a bubble:

//show info bubble
ui.addBubble(bubble);
openInfoBubble = bubble;

Then when you need to close the open InfoBubble:

if (openInfoBubble != null)
  ui.removeBubble(openInfoBubble);

Hopefully, that answers your questions... good luck.

Upvotes: 1

Related Questions