Here Map - Javascript - 切换到夜间模式
HereMap - Javascript - Switch to night Mode
我是 HereMap 的初学者 - 我将它与 Js 和 php + html 一起使用来显示带有状态和气泡的标记。
我想要的是切换到名为 normal.night.grey
的夜间模式,但我真的不知道该怎么做。
我查看了官方支持:
https://developer.here.com/documentation/maps/topics_api/h-service-maptype.html
这里有一些例子:
http://heremaps.github.io/examples/explorer.html#map-tiles__base-map-styles-and-modes
但这并不容易理解...
我实际做了什么:
function addMarkerToGroup(group, coordinate, icon, html) {
var marker = new H.map.Marker(coordinate,icon);
marker.setData(html);
group.addObject(marker);
}
function addInfoBubble(map) {
var group = new H.map.Group();
map.addObject(group);
group.addEventListener('tap', function (evt) {
var bubble = new H.ui.InfoBubble(evt.target.getGeometry(), {
content: evt.target.getData()
});
ui.addBubble(bubble);
}, false);
//
// Here are some PHP code to generate markers from database
//
}
// Map initialization code starts below:
var platform = new H.service.Platform({
apikey: 'myapikey'
});
var defaultLayers = platform.createDefaultLayers();
// initialize a map - this map is centered over Europe
var map = new H.Map(document.getElementById('map'),
defaultLayers.vector.normal.map,{
center: new H.geo.Point(23.763987,11.753125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});
// add a resize listener to make sure that the map occupies the whole container
window.addEventListener('resize', () => map.getViewPort().resize());
// MapEvents enables the event system
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
// create default UI with layers provided by the platform
var ui = H.ui.UI.createDefault(map, defaultLayers);
// Now use the map as required...
addInfoBubble(map);
只要把defaultLayers.vector.normal.map
改成defaultLayers.normal.mapnight
var map = new H.Map(document.getElementById('map'),
defaultLayers.normal.mapnight, {
center: new H.geo.Point(23.763987,11.753125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});
找到了,谢谢@user863。
需要从光栅切换到矢量。
var map = new H.Map(document.getElementById('map'),
defaultLayers.raster.normal.mapnight,{
center: new H.geo.Point(23.563987,11.953125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});
我是 HereMap 的初学者 - 我将它与 Js 和 php + html 一起使用来显示带有状态和气泡的标记。
我想要的是切换到名为 normal.night.grey
的夜间模式,但我真的不知道该怎么做。
我查看了官方支持:
https://developer.here.com/documentation/maps/topics_api/h-service-maptype.html
这里有一些例子:
http://heremaps.github.io/examples/explorer.html#map-tiles__base-map-styles-and-modes
但这并不容易理解...
我实际做了什么:
function addMarkerToGroup(group, coordinate, icon, html) {
var marker = new H.map.Marker(coordinate,icon);
marker.setData(html);
group.addObject(marker);
}
function addInfoBubble(map) {
var group = new H.map.Group();
map.addObject(group);
group.addEventListener('tap', function (evt) {
var bubble = new H.ui.InfoBubble(evt.target.getGeometry(), {
content: evt.target.getData()
});
ui.addBubble(bubble);
}, false);
//
// Here are some PHP code to generate markers from database
//
}
// Map initialization code starts below:
var platform = new H.service.Platform({
apikey: 'myapikey'
});
var defaultLayers = platform.createDefaultLayers();
// initialize a map - this map is centered over Europe
var map = new H.Map(document.getElementById('map'),
defaultLayers.vector.normal.map,{
center: new H.geo.Point(23.763987,11.753125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});
// add a resize listener to make sure that the map occupies the whole container
window.addEventListener('resize', () => map.getViewPort().resize());
// MapEvents enables the event system
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
// create default UI with layers provided by the platform
var ui = H.ui.UI.createDefault(map, defaultLayers);
// Now use the map as required...
addInfoBubble(map);
只要把defaultLayers.vector.normal.map
改成defaultLayers.normal.mapnight
var map = new H.Map(document.getElementById('map'),
defaultLayers.normal.mapnight, {
center: new H.geo.Point(23.763987,11.753125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});
找到了,谢谢@user863。 需要从光栅切换到矢量。
var map = new H.Map(document.getElementById('map'),
defaultLayers.raster.normal.mapnight,{
center: new H.geo.Point(23.563987,11.953125),
zoom: 2.95,
pixelRatio: window.devicePixelRatio || 1
});