diff --git a/src/HEREMap.tsx b/src/HEREMap.tsx index a66d1ef..ff466a8 100644 --- a/src/HEREMap.tsx +++ b/src/HEREMap.tsx @@ -230,9 +230,14 @@ export const HEREMap = forwardRef(({ apikey: apiKey, }) + const ppi = engineType === H.Map.EngineType.P2D + ? hidpi ? 320 : 72 + : undefined + defaultLayersRef.current = platform.createDefaultLayers({ lg: getTileLanguage(language), engineType, + ppi, }) as DefaultLayers const hereMapEl = document.querySelector(`#map-container-${uniqueIdRef.current}`) as HTMLElement diff --git a/src/useLegacyRasterLayers.ts b/src/useLegacyRasterLayers.ts index 17c0733..72d43e7 100644 --- a/src/useLegacyRasterLayers.ts +++ b/src/useLegacyRasterLayers.ts @@ -23,7 +23,7 @@ export const getLayers = ( hidpi?: boolean, ) => { const lang = getTileLanguage(language) - const ppi = hidpi ? 400 : 100 + const ppi = hidpi ? 200 : 100 const format = 'png8' const getTrafficOverlayProvider = (): H.map.provider.ImageTileProvider.Options => { diff --git a/src/useRasterLayers.ts b/src/useRasterLayers.ts index b8b269e..a59e017 100644 --- a/src/useRasterLayers.ts +++ b/src/useRasterLayers.ts @@ -34,7 +34,7 @@ const getBaseLayer = ({ const service = platform.getRasterTileService({ queryParams: { lang, - ppi: hidpi ? 200 : 100, + scale: hidpi ? 2 : 1, style: trafficLayer ? 'lite.day' : 'logistics.day', ...(congestion ? { @@ -45,7 +45,7 @@ const getBaseLayer = ({ }) const provider = - new H.service.rasterTile.Provider(service, { engineType: H.Map.EngineType.HARP, tileSize: 256 }) + new H.service.rasterTile.Provider(service, { engineType: H.Map.EngineType.HARP, tileSize: hidpi ? 512 : 256 }) return new H.map.layer.TileLayer(provider) } @@ -68,12 +68,12 @@ const getTruckOverlayLayer = ({ features: `vehicle_restrictions:${showActiveAndInactiveTruckRestrictions ? 'active_and_inactive' : 'permanent_only'}`, style: 'logistics.day', lang, - ppi: hidpi ? 200 : 100, + scale: hidpi ? 2 : 1, }, }) const truckOverlayProvider = - new H.service.rasterTile.Provider(truckOnlyTileService, { engineType: H.Map.EngineType.HARP, tileSize: 256 }) + new H.service.rasterTile.Provider(truckOnlyTileService, { engineType: H.Map.EngineType.HARP, tileSize: hidpi ? 512 : 256 }) return new H.map.layer.TileLayer(truckOverlayProvider) } diff --git a/testbench/index.html b/testbench/index.html index 0e9f38f..fddbc37 100644 --- a/testbench/index.html +++ b/testbench/index.html @@ -1,4 +1,7 @@ + + +