Upon completing the creation and display of the map, an unusual occurrence is taking place where the map buttons ("Zoom rectangular, map settings, and scale bar") are appearing below the map as oversized icons. Additionally, there is a challenge when setting the map width and height to 100% - the map only becomes visible after resizing the Chrome page.
I have attempted to use different default layer types such as normal and satellite maps. As for the issue with width and height, setting it to fixed values worked flawlessly. However, once set to 100%, the map vanishes, revealing the large map buttons mentioned earlier.
public ngAfterViewInit() { let defaultLayers = this.platform.createDefaultLayers(); defaultLayers.normal.map.setMin(5); this.map = new H.Map( document.getElementById("mapId"), defaultLayers.normal.map, { center: { lat: "0", lng: "0" } } ); this.ui = H.ui.UI.createDefault(this.map, defaultLayers); this.ui.getControl('mapsettings').setAlignment('top-left'); this.ui.getControl('zoom').setAlignment('top-left'); this.ui.getControl('scalebar').setAlignment('top-left'); }
The expectation is to have the map buttons displayed on the map itself rather than beneath it, and to have the ability to set the height to 100% without any visibility issues.