const map = this.map = new BMap.Map(this.map_container.nativeElement, {
enableMapClick: true,
// minZoom: 11,
// maxZoom : 11
}); // 创建地图实例
// 这里我们使用BMap命名空间下的Point类来创建一个坐标点。Point类描述了一个地理坐标点,其中116.404表示经度,39.915表示纬度。(为天安门坐标)
const point = new BMap.Point(113.922329, 22.49656); // 坐标可以通过百度地图坐标拾取器获取 --万融大厦
map.centerAndZoom(point, 19); // 设置中心和地图显示级别
// map.centerAndZoom(new BMap.Point(105.403119, 38.028658), 5); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放
// 地图自定义样式
map.setMapStyle({
styleJson: [{
'featureType': 'water',
'elementType': 'all',
'stylers': {
'color': '#044161'
}
}, {
'featureType': 'land',
'elementType': 'all',
'stylers': {
'color': '#091934'
}
}, {
'featureType': 'boundary',
'elementType': 'geometry',
'stylers': {
'color': '#064f85'
}
}, {
'featureType': 'railway',
'elementType': 'all',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'highway',
'elementType': 'geometry',
'stylers': {
'color': '#004981'
}
}, {
'featureType': 'highway',
'elementType': 'geometry.fill',
'stylers': {
'color': '#005b96',
'lightness': 1
}
}, {
'featureType': 'highway',
'elementType': 'labels',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'arterial',
'elementType': 'geometry',
'stylers': {
'color': '#004981',
'lightness': -39
}
}, {
'featureType': 'arterial',
'elementType': 'geometry.fill',
'stylers': {
'color': '#00508b'
}
}, {
'featureType': 'poi',
'elementType': 'all',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'green',
'elementType': 'all',
'stylers': {
'color': '#056197',
'visibility': 'off'
}
}, {
'featureType': 'subway',
'elementType': 'all',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'manmade',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'local',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'arterial',
'elementType': 'labels',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'boundary',
'elementType': 'geometry.fill',
'stylers': {
'color': '#029fd4'
}
}, {
'featureType': 'building',
'elementType': 'all',
'stylers': {
'color': '#1a5787'
}
}, {
'featureType': 'label',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'poi',
'elementType': 'labels.text.fill',
'stylers': {
'color': '#ffffff'
}
}, {
'featureType': 'poi',
'elementType': 'labels.text.stroke',
'stylers': {
'color': '#1e1c1c'
}
}, {
'featureType': 'administrative',
'elementType': 'labels',
'stylers': {
'visibility': 'on'
}
}, {
'featureType': 'road',
'elementType': 'labels',
'stylers': {
'visibility': 'on'
}
}]
});
参考: