如何在 UI 控件中获取地形图 HERE Maps v3.1

How do I get a Terrain Map in UI Controls HERE Maps v3.1

升级到具有vector/WebGL渲染功能的v3.1 Javascript SDK后,默认UI控件中现在没有地形层。

我查看了 API 文档,但我找不到明确的示例来说明如何指定 UI 控件中显示的内容。

    var platform = new H.service.Platform({
            apikey: 'key'
    });

    var layers = platform.createDefaultLayers();

    var hereMap = new H.Map(
        document.getElementById(mapCanvasDiv),
        defaultLayers.vector.normal.map,
        {
            zoom: mapOptions.zoom,
            center: mapOptions.center
    });

    var ui = H.ui.UI.createDefault(hereMap, defaultLayers);

    // Guessing I can change "ui" in some way to include the terrain layer which is a raster layer.

    hereMap.UIControls = ui;

我希望在 UI 控件中包含法线、地形和卫星层,就像我们使用 v3.0 时一样,因为我们的一些客户使用此层。

请参阅下面两个关于

的链接

"正在设置底图类型"。 https://developer.here.com/documentation/maps/topics/map-types.html

"光栅" https://developer.here.com/documentation/maps/topics/raster.html

"H.ui.MapSettingsControl.Options" https://developer.here.com/documentation/maps/topics_api/h-ui-mapsettingscontrol-options.html#h-ui-mapsettingscontrol-options

为了使用卫星和地形,请使用栅格地图类型。

defaultLayers.raster.terrain.map
defaultLayers.raster.satellite.map

例如自定义地图设置控件

var defaultLayers = platform.createDefaultLayers();
var map = new H.Map(document.getElementById('map'),
    defaultLayers.raster.terrain.map, {
    center: {lat: 52.51477270923461, lng: 13.39846691425174},
    zoom: 13,
    pixelRatio: window.devicePixelRatio || 1
});
var ui = H.ui.UI.createDefault(map, defaultLayers);
//remove default mapsettings control
ui.removeControl("mapsettings");
// create custom one
var ms = new H.ui.MapSettingsControl( {
    baseLayers : [ { 
      label:"normal",layer:defaultLayers.raster.normal.map
    },{
      label:"satellite",layer:defaultLayers.raster.satellite.map
    }, {
      label:"terrain",layer:defaultLayers.raster.terrain.map
    }
    ],
  layers : [{
        label: "layer.traffic", layer: defaultLayers.vector.normal.traffic
    },
    {
        label: "layer.incidents", layer: defaultLayers.vector.normal.trafficincidents
    }
]
  });
ui.addControl("customized",ms);

编码愉快!