Skip to content

Map Editor Style / HARP Engine with UI and InfoBubbles #149

Closed
@npenner

Description

@npenner

Hi,
i am trying to implement a style from the map style editor on a map with custom markers and the default UI. Somehow i cannot get it to work. Referring to this example, how would you add the UI elements?
https://www.developer.here.com/documentation/examples/maps-js/style-editor/change-harp-style-at-load

I am pretty confident it is a matter of layers and having a "defaultLayer" where to add the UI.

In #135 it is suggested that the HARP engine is somehow incompatible with the default layers.
Is that my problem?

My current code looks like this (pathtomystyle.json is a working path and the style is set fine) :

const defaultLayers = platform.createDefaultLayers()
const engineType = H.Map.EngineType['HARP']
const style = new H.map.render.harp.Style('pathtomystyle.json')
const vectorLayer = platform.getOMVService().createLayer(style, { engineType })

const map = new H.Map(mapDiv,
    vectorLayer,
    {   
        engineType,
        center: {lat:53.075715241653725, lng:8.827192671898858},
        zoom: 10,
        pixelRatio: window.devicePixelRatio || 1
    }
)

window.addEventListener('resize', () => map.getViewPort().resize())

const behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map))
const ui = H.ui.UI.createDefault(map, defaultLayers, 'de-DE')

The error i get looks like this:

Uncaught TypeError: Cannot read properties of undefined (reading 'layer')
at gw (eval at <anonymous> (mapsjs-core.js:73:36), <anonymous>:131:231)
at dw.createDefault (eval at <anonymous> (mapsjs-core.js:73:36), <anonymous>:128:126)
at initMap (main.js:109:24)
at HTMLDocument.<anonymous> (main.js:260:23)

main.js:109:24 is the line beginning with "const ui = ..."
I have a feeling it is missing the part where the defaultLayers get "attached" to the map but i cannot figure out how to do that. I tried some stuff with the "addLayer" function but unsuccessful.

Any help or hints are much appreciated.
Thanks in Advance!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions