Search code examples
here-api

Creating a custom "Map Tile Layer" for HERE-Maps

Currently I´m using the pre-defined TileLayer "normal.day.grey" but there are still colors which have to be changed. I also checked for other TileLayers which are provided by the Map Tile API but I´m not able to meet the requirements.

Currently specific buildings are colored red and different environments in a green and grey tint. enter image description here

The requirements are:

  1. Streets and buildings: white-color
  2. Environment should be in a light-grey-color

I want to achieve the same style as in the picture. enter image description here

[Picture is from the styling wizard from Google-Maps ("Map-Style: Silver")]

Is there some way to customize the map? I have already spent a lot of time to research for this topic but it seems there is no way than using the predefined Tile-Layers.

Applying the style to the map:

function setBaseLayer(map, platform){
  var mapTileService = platform.getMapTileService({
  type: 'base'
});
  var parameters = {};
  var tileLayer = mapTileService.createTileLayer(
    'maptile',
    'normal.day.grey',
    256,
    'png8',
    parameters
);
map.setBaseLayer(tileLayer);
}
Solution

  • For the map tiles are just predefined styles offered. But you can choose nxt to the schema also a different tile type. I think this one comes pretty close:

    https://4.base.maps.cit.api.here.com/maptile/2.1/mapnopttile/b833b72c5f/reduced.day/14/8586/5547/256/png?xnlp=CL_JSMv3.0.17.0&app_id=xxx&app_code=yyy&lg=ENG&lg2=ENG

    Here you can find an extended example for trying out different variants:

    https://tcs.ext.here.com/examples/v3/mrs_options