平常开发中有需要使用地图的需求，在网上查了很多方法，包括引入百度地图第三方库，还是有问题，发现最简单的方法就是在index.html中引入script，然后直接在相关页面肝就完事。
1.申请相关项目的ak,注意应用类别为浏览器端
2.在vue项目入口的index,html中引入
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=0T6wNc9abbq6M0fp692Gkc8tslTG4bGQ">
</script>
3.如果需求是自定义地图样式，则需要自定义地图样式的id，或者json文件
// 自定义地图样式的json数据
export const mapConfig = [
{
"featureType": "land",
"elementType": "geometry",
"stylers": {
"color": "#02233fff",
"visibility": "on"
}
}, {
"featureType": "water",
"elementType": "labels.text.fill",
"stylers": {
"color": "#02233fff",
"visibility": "on"
}
}, {
"featureType": "building",
"elementType": "geometry.fill",
"stylers": {
"color": "#001730ff",
"visibility": "on"
}
}, {
"featureType": "building",
"elementType": "geometry.stroke",
"stylers": {
"color": "#000517ff",
"visibility": "on"
}
}, {
"featureType": "water",
"elementType": "geometry",
"stylers": {
"color": "#00348eff",
"visibility": "on"
}
}, {
"featureType": "village",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "town",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "district",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "country",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "city",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "continent",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "poilabel",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "poilabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#00348eff",
"visibility": "on"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#00348eff",
"visibility": "on"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "airportlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#00348eff",
"visibility": "on"
}
}, {
"featureType": "airportlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "road",
"elementType": "geometry.fill",
"stylers": {
"color": "#20569fff",
"visibility": "on"
}
}, {
"featureType": "road",
"elementType": "geometry.stroke",
"stylers": {
"color": "#0073f4ff",
"visibility": "on"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "green",
"elementType": "geometry",
"stylers": {
"color": "#04384cff",
"visibility": "on"
}
}, {
"featureType": "scenicspots",
"elementType": "geometry",
"stylers": {
"color": "#02233fff",
"visibility": "off"
}
}, {
"featureType": "scenicspots",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "scenicspots",
"elementType": "labels.text.stroke",
"stylers": {
"weight": 1,
"color": "#02233fff",
"visibility": "on"
}
}, {
"featureType": "continent",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "country",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "city",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "city",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "airportlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "railway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "subway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "highwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "nationalwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "nationalwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "provincialwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "provincialwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "tertiarywaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "tertiarywaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "subwaylabel",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "subwaylabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "road",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on",
"weight": 90
}
}, {
"featureType": "road",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#0073f4ff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "shopping",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "scenicspots",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "manmade",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "manmade",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "highwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "water",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#04384c00",
"visibility": "on"
}
}, {
"featureType": "road",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "road",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "road",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "road",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "road",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "road",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "road",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "road",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "road",
"elementType": "labels.text",
"stylers": {
"fontsize": 24
}
}, {
"featureType": "highway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "highway",
"elementType": "geometry.fill",
"stylers": {
"color": "#20569fff",
"visibility": "on"
}
}, {
"featureType": "highway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#0073f4ff"
}
}, {
"featureType": "highway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "nationalway",
"elementType": "geometry.fill",
"stylers": {
"color": "#20569fff",
"visibility": "on"
}
}, {
"featureType": "nationalway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#0073f4ff"
}
}, {
"featureType": "nationalway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "nationalway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "provincialway",
"elementType": "geometry.fill",
"stylers": {
"color": "#20569fff",
"visibility": "on"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry.fill",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "arterial",
"elementType": "geometry.fill",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "tertiaryway",
"elementType": "geometry.fill",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry.fill",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "local",
"elementType": "geometry.fill",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "provincialway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#0073f4ff",
"visibility": "on"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "arterial",
"elementType": "geometry.stroke",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "tertiaryway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "local",
"elementType": "geometry.stroke",
"stylers": {
"color": "#2d3b78ff",
"visibility": "on"
}
}, {
"featureType": "local",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "local",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "fourlevelway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "tertiaryway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "arterial",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "cityhighway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "provincialway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff",
"visibility": "on"
}
}, {
"featureType": "provincialway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "cityhighway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "arterial",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "tertiaryway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "fourlevelway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#02233fff",
"visibility": "on",
"weight": 1
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry",
"stylers": {
"weight": 1
}
}, {
"featureType": "tertiaryway",
"elementType": "geometry",
"stylers": {
"weight": 1
}
}, {
"featureType": "local",
"elementType": "geometry",
"stylers": {
"weight": 1
}
}, {
"featureType": "provincialway",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "arterial",
"elementType": "geometry",
"stylers": {
"weight": 3
}
}, {
"featureType": "highway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "highway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "highway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "highway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "highway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "highway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "highway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "highway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "nationalway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "nationalway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "nationalway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "nationalway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "provincialway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "8"
}
}, {
"featureType": "provincialway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "9"
}
}, {
"featureType": "provincialway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "8"
}
}, {
"featureType": "provincialway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "9"
}
}, {
"featureType": "provincialway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "8"
}
}, {
"featureType": "provincialway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "8,10",
"level": "9"
}
}, {
"featureType": "cityhighway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "cityhighway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "cityhighway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "cityhighway",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "6"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "7"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "8"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "6,9",
"level": "9"
}
}, {
"featureType": "arterial",
"stylers": {
"curZoomRegionId": "0",
"curZoomRegion": "9,9",
"level": "9"
}
}, {
"featureType": "arterial",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "9,9",
"level": "9"
}
}, {
"featureType": "arterial",
"elementType": "labels",
"stylers": {
"visibility": "off",
"curZoomRegionId": "0",
"curZoomRegion": "9,9",
"level": "9"
}
}, {
"featureType": "scenicspotsway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "universityway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "vacationway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "country",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "district",
"elementType": "labels.text.fill",
"stylers": {
"color": "#7badefff"
}
}, {
"featureType": "island",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "building",
"elementType": "geometry.topfill",
"stylers": {
"color": "#0748a7ff"
}
}, {
"featureType": "building",
"elementType": "geometry.sidefill",
"stylers": {
"color": "#05255aff"
}
}]
4.在相关页面实例化，注意：最后在onMounted页面实例化之后加载地图，否则地图可能会加载不出来
// 定义div
<template>
<div class="bmap" id="container"></div>
</template>
<script lang="ts">
import { defineComponent, ref, nextTick, onMounted, unref } from 'vue';
// 引入自定义地图样式json
import { mapConfig } from './index';
export default defineComponent({
setup() {
const BMap = (window as any).BMapGL;
onMounted(() => {
var map = new BMap.Map('container');
var point = new BMap.Point(119.922883, 32.456692);
map.centerAndZoom(point, 15);
map.enableScrollWheelZoom(true);
map.addEventListener('click', function (e: any) {
console.log('点击的经纬度：' + e.point.lng + ',' + e.point.lat); //
});
// 使用地图样式 id方法 两者二选一
map.setMapStyleV2({
styleId: ''
});
// 使用地图样式 json方法 两者二选一
map.setMapStyleV2({
styleJson: mapConfig
});
});
},
});
<style lang="less" scoped>
.bmap {
width: 800px;
height: 600px;
border: 1px solid #000;
}
</style>
