Here api 如何在这里创建只有普通地图和卫星视图,没有额外图层的地图?
我们很难重构代码,不再使用平台中的“createDefaultLayers()”,而是将地图拆分为只使用基本的“普通”地图和“卫星”地图 我们目前有:Here api 如何在这里创建只有普通地图和卫星视图,没有额外图层的地图?,here-api,Here Api,我们很难重构代码,不再使用平台中的“createDefaultLayers()”,而是将地图拆分为只使用基本的“普通”地图和“卫星”地图 我们目前有: var maptypes = platform.createDefaultLayers(); hereMap = new H.Map( document.getElementById('map-container'), maptypes.normal.map,
var maptypes = platform.createDefaultLayers();
hereMap = new H.Map(
document.getElementById('map-container'),
maptypes.normal.map,
{
zoom: ...,
center: ...,
pixelRatio: Math.min(devicePixelRatio, 2)
}
);
var ui = H.ui.UI.createDefault(hereMap, maptypes);
这样,我们就得到了一个额外的地图类型和3个不同的地图选项(交通、事故、公共交通),我们根本不想加载它们
我很难找到一个创建我们自己的基本地图和卫星图层并将其插入ui和地图的简单示例。特别是因为createDefaultLayers()返回一个完全独立的类型,而不是一组层
任何帮助都将不胜感激 此示例创建自定义法线和卫星H.map.layer.TileLayer,将其添加到H.map,然后连接H.ui.ui:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0,
width=device-width" />
<script src="https://js.api.here.com/v3/3.0/mapsjs-core.js"
type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.0/mapsjs-service.js"
type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.0/mapsjs-ui.js"
type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" type="text/css"
href="https://js.api.here.com/v3/3.0/mapsjs-ui.css" />
</head>
<body>
<div style="width: 640px; height: 480px" id="mapContainer"></div>
<script>
// Initialize the platform object:
var platform = new H.service.Platform({
'app_id': 'app_id',
'app_code': 'app_code'
});
// Via:
// https://developer.here.com/documentation/geovisualization/topics/js-initialize-map.html
//
// createTileLayer (tileType, scheme, tileSize, format, opt_additionalParameters, opt_opacity, opt_dark, opt_options) : {H.map.layer.TileLayer}
var normalLayer = platform.getMapTileService({type: 'base'}).createTileLayer(
'maptile',
'reduced.night',
256,
'png'
);
var satelliteLayer = platform.getMapTileService({type: 'aerial'}).createTileLayer(
'maptile',
'satellite.day',
256,
'png8'
);
// Instantiate (and display) a map object:
// H.Map(element := {Element}, baseLayer := {H.map.layer.Layer}, opt_options := {H.Map.Options=} [optional])
// Via:
// https://developer.here.com/documentation/maps/topics_api/h-map.html
var map = new H.Map(
document.getElementById('mapContainer'),
normalLayer,
{
pixelRatio: 1,
center: new H.geo.Point(40.769832, -73.974726),
zoom: 14
}
);
// Create a barebones H.service.DefaultLayers object
// Note: the UI map settings incorrectly initially enables traffic and
// public transport selections
var maptypes = new Object();
maptypes.normal = new Object();
maptypes.normal.map = normalLayer;
maptypes.satellite = new Object();
maptypes.satellite.map = satelliteLayer;
var ui = H.ui.UI.createDefault(map, maptypes);
var menuEntries = ui.getControl('mapsettings').getChildren()[1].getChildren();
menuEntries[0].getElement().style.borderBottom = 'none';
for (let i=1; i<menuEntries.length; i++)
menuEntries[i].setVisibility(false);
</script>
</body>
</html>
我觉得这很有帮助。例如,选择>查看代码>JavaScript映射API,其中显示示例代码
JavaScript的mapsapi具有类似的特性
最后,为了清理H.ui.ui地图设置选项交通条件和公共交通的不必要显示,我通过以下回答使用了一种解决方法:
(看起来你也得到了来自这里的支持)
var maptypes = platform.createDefaultLayers();
delete maptypes.terrain;
delete maptypes.normal.traffic;
...