文章目录
先上效果图

先简单解释一下百度地图的这个功能吧,如果是只想设置3D地图或者自定义样式这两者中的一个,那么很轻松就可以找到例子,但是两者结合的例子我百度搜索翻了好几页都没找到,最后还是翻官方文档找到的。究其原因就在于,3D地图只能用GL版,GL版设置自定义样式需要用到setMapStyleV2,而setMapStyleV2是js3.0的api,但是现在网上大部分文章都是js2.0互相抄,几乎没有用js3.0的文章,所以即便找到了相关的文章也无法直接使用。
文档地址:https://lbs.baidu.com/index.php?title=jspopularGL/guide/custom
文档写的很详细,不做过多说明。
样式编辑器(上面的文档中有链接,直接写出来方便查看)https://lbsyun.baidu.com/apiconsole/custommap
某个默认模板https://lbsyun.baidu.com/customv2/preview/demo/yanmou
代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="https://api.map.baidu.com/api?type=webgl&v=1.0&ak=F0i6SrLmHquLVNLCqpExxPrj8mWVdFwx"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.4.1/jquery.js"></script>
<script src="jquery3.4.1.js"></script>
<title>设置地图3D视角</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// GL版命名空间为BMapGL
// 按住鼠标右键,修改倾斜角和角度
var map = new BMapGL.Map("allmap"); // 创建Map实例
map.centerAndZoom(new BMapGL.Point(123.362222, 41.773469), 18); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
map.setHeading(0);//角度
map.setTilt(60);//倾斜角
// console.log(map.getMapType());
// console.log(map.setMapStyleId);
// console.log(map.getMapStyleId());
//map.setMapStyleV2(myStyleJson);
var myStyleJson=[{
"featureType": "land",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#091220ff"
}
}, {
"featureType": "water",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#113549ff"
}
}, {
"featureType": "green",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#0e1b30ff"
}
}, {
"featureType": "building",
"elementType": "geometry",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "building",
"elementType": "geometry.topfill",
"stylers": {
"color": "#113549ff"
}
}, {
"featureType": "building",
"elementType": "geometry.sidefill",
"stylers": {
"color": "#143e56ff"
}
}, {
"featureType": "building",
"elementType": "geometry.stroke",
"stylers": {
"color": "#dadada00"
}
}, {
"featureType": "subwaystation",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#113549B2"
}
}, {
"featureType": "education",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#12223dff"
}
}, {
"featureType": "medical",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#12223dff"
}
}, {
"featureType": "scenicspots",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"color": "#12223dff"
}
}, {
"featureType": "highway",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"weight": "4"
}
}, {
"featureType": "highway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "highway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#fed66900"
}
}, {
"featureType": "highway",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "highway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "highway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "highway",
"elementType": "labels.icon",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "arterial",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"weight": "2"
}
}, {
"featureType": "arterial",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "arterial",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffeebb00"
}
}, {
"featureType": "arterial",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "arterial",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "arterial",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "local",
"elementType": "geometry",
"stylers": {
"visibility": "on",
"weight": "1"
}
}, {
"featureType": "local",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "local",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "local",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "local",
"elementType": "labels.text.fill",
"stylers": {
"color": "#979c9aff"
}
}, {
"featureType": "local",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffffff"
}
}, {
"featureType": "railway",
"elementType": "geometry",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "subway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"weight": "1"
}
}, {
"featureType": "subway",
"elementType": "geometry.fill",
"stylers": {
"color": "#d8d8d8ff"
}
}, {
"featureType": "subway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "subway",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "subway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#979c9aff"
}
}, {
"featureType": "subway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffffff"
}
}, {
"featureType": "continent",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "continent",
"elementType": "labels.icon",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "continent",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "continent",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "city",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "city",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "city",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "city",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "town",
"elementType": "labels.icon",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "town",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "town",
"elementType": "labels.text.fill",
"stylers": {
"color": "#454d50ff"
}
}, {
"featureType": "town",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffffff"
}
}, {
"featureType": "road",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "poilabel",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "districtlabel",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "road",
"elementType": "geometry",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "road",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "road",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "district",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "poilabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "poilabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "poilabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "manmade",
"elementType": "geometry",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "districtlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffffff"
}
}, {
"featureType": "entertainment",
"elementType": "geometry",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "shopping",
"elementType": "geometry",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "nationalway",
"stylers": {
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"stylers": {
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"stylers": {
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"stylers": {
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"stylers": {
"level": "10",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "10",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "nationalway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "10",
"curZoomRegionId": "0",
"curZoomRegion": "6-10"
}
}, {
"featureType": "cityhighway",
"stylers": {
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"stylers": {
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"stylers": {
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"stylers": {
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry",
"stylers": {
"visibility": "off",
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "6",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "7",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "8",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "cityhighway",
"elementType": "labels",
"stylers": {
"visibility": "off",
"level": "9",
"curZoomRegionId": "0",
"curZoomRegion": "6-9"
}
}, {
"featureType": "subwaylabel",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "subwaylabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "tertiarywaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "tertiarywaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "provincialwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "provincialwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "nationalwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "nationalwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "highwaysign",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "highwaysign",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "village",
"elementType": "labels",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "district",
"elementType": "labels.text",
"stylers": {
"fontsize": "20"
}
}, {
"featureType": "district",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "district",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "country",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "country",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "water",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "water",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "cityhighway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "tertiaryway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "tertiaryway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff10"
}
}, {
"featureType": "provincialway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "provincialway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "nationalway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "nationalway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "highway",
"elementType": "labels.text",
"stylers": {
"fontsize": "20"
}
}, {
"featureType": "nationalway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "nationalway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "nationalway",
"elementType": "labels.text",
"stylers": {
"fontsize": "20"
}
}, {
"featureType": "provincialway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "provincialway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "provincialway",
"elementType": "labels.text",
"stylers": {
"fontsize": "20"
}
}, {
"featureType": "cityhighway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "cityhighway",
"elementType": "labels.text",
"stylers": {
"fontsize": "20"
}
}, {
"featureType": "cityhighway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "estate",
"elementType": "geometry",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "tertiaryway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "tertiaryway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "fourlevelway",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "fourlevelway",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "scenicspotsway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "scenicspotsway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "universityway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "universityway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "vacationway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "vacationway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry.fill",
"stylers": {
"color": "#12223dff"
}
}, {
"featureType": "fourlevelway",
"elementType": "geometry.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "transportationlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "educationlabel",
"elementType": "labels",
"stylers": {
"visibility": "on"
}
}, {
"featureType": "educationlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "educationlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "educationlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "transportation",
"elementType": "geometry",
"stylers": {
"color": "#113549ff"
}
}, {
"featureType": "airportlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "airportlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "medicallabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "medicallabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "medicallabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "scenicspotslabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "airportlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "entertainmentlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "entertainmentlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "entertainmentlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "estatelabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "estatelabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "estatelabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "businesstowerlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "businesstowerlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "businesstowerlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "companylabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "companylabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "companylabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "governmentlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "governmentlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "governmentlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "restaurantlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "restaurantlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "restaurantlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "hotellabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "hotellabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "hotellabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "shoppinglabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "shoppinglabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "shoppinglabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "lifeservicelabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "lifeservicelabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "lifeservicelabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "carservicelabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "carservicelabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "carservicelabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "financelabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "financelabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "financelabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "otherlabel",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "otherlabel",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "otherlabel",
"elementType": "labels.icon",
"stylers": {
"visibility": "off"
}
}, {
"featureType": "manmade",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "manmade",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "transportation",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "transportation",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "education",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "education",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "medical",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "medical",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}, {
"featureType": "scenicspots",
"elementType": "labels.text.fill",
"stylers": {
"color": "#2dc4bbff"
}
}, {
"featureType": "scenicspots",
"elementType": "labels.text.stroke",
"stylers": {
"color": "#ffffff00"
}
}];
map.setMapStyleV2({
styleJson: myStyleJson
});
</script>
配置代码是对街道、陆地、河流等各种对象的边、填充、字体等分别设定,所以配置的代码非常长,建议存到json文件中调用。