自定义百度地图样式
项目需求要把地图做成符合页面整体UI的样式,效果图如下:

话不多说贴代码
// 自定义主题map.setMapStyle({ styleJson: [ { featureType: "water", elementType: "all", stylers: { color: "#102d68", }, }, { featureType: "land", elementType: "all", stylers: { color: "#091934", }, }, { featureType: "boundary", elementType: "geometry", stylers: { color: "#064f85", }, }, { featureType: "railway", elementType: "all", stylers: { visibility: "off", }, }, { 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: "off", }, }, { featureType: "green", elementType: "all", stylers: { color: "#102f6d", visibility: "off", }, }, { featureType: "subway", elementType: "all", stylers: { visibility: "off", }, }, { featureType: "manmade", elementType: "all", stylers: { visibility: "off", }, }, { featureType: "local", elementType: "all", stylers: { visibility: "off", }, }, { featureType: "arterial", elementType: "labels", stylers: { visibility: "off", }, }, { featureType: "boundary", elementType: "geometry.fill", stylers: { color: "#029fd4", }, }, { featureType: "building", elementType: "all", stylers: { color: "#1a5787", }, }, { featureType: "label", elementType: "all", stylers: { color: "#0e9cd2", "font-weight": "bold", visibility: "on", }, }, { featureType: "administrative", // 村名 elementType: "labels", stylers: { visibility: "on", }, }, { featureType: "administrative", elementType: "labels.text.stroke", stylers: { color: "#0e9cd200", weight: 0, }, }, { featureType: "road", // 路名 elementType: "labels", stylers: { visibility: "off", }, }, ], });
完结,嘻嘻~~