个性化地图可对地图进行个性化配置。通过该服务,允许用户将传统默认的地图样式按需配置,自由控制地图元素显隐及对应的元素样式。
用户可以通过个性化地图样式编辑器,按需编辑地图的底图样式,再按相应应用端的功能要求,将样式应用在JavaScript API和地图SDK中。
以下为个性化地图在JavaScript API中的相关说明。

注意:个性化定制功能适用于PC端和手机端全部现代浏览器(支持HTML5, WebGL),同时可在百度地图JavaScript API和Android/iOS SDK中复用样式,一次编辑多端共用。

进入地图开放平台控制台页面,在我的地图中,创建一个地图样式:

点击创建的地图样式,进入样式编辑器,根据您的需求自由编辑地图样式:

完成编辑后,在我的地图或者编辑器中发布该地图样式,获取发布后生成的样式ID:

将第三步中获取的样式ID作为setMapStyle方法的参数。(注意:发布的styleID需要与ak为同一个用户)
相关代码如下:
map.setMapStyle({styleId: '3d71dc5a4ce6222d3396801dee06622d'});
注意:
样式更新不会改变样式ID。因此如果有更新样式的需求,重新编辑发布就可以完成更新。不需要修改JavaScript API调用代码;
如果样式ID在控制台中被删除,但JavaScript API还在继续调用。那么将会渲染默认样式的地图。
前序流程和样式ID调用地图样式流程一致,进入我的地图,创建一个地图样式,进入编辑器编辑完成后,直接通过编辑器中的“下载JSON”功能获取JSON代码:

将上一步中获取的样式JSON作为setMapStyle方法的参数。
相关代码如下:
var styleJson = [{"featureType": "land","elementType": "geometry","stylers": {"color": "#f5f4f4ff"}}, {"featureType": "water","elementType": "geometry","stylers": {"color": "#86cee6ff"}}// ... 省略剩余json];map.setMapStyle({styleJson:styleJson});
同样,进入个性化编辑器,点 studio 切换到详细分类,再点击室内图配置具体的样式。

通过开启 merge 参数,支持渲染室内图个性化以及合并样式(合并样式会基于地图默认样式与你配置的样式进行合并渲染,可以获得更好的性能)
map.setMapStyle({styleJson: darkStyleIndoor,merge: true});
上一篇
下一篇