百度地图(4)-自定义地图样式

百度地图提供了地图样式的定制,定制种类相当繁多,可以细致到道路、

1. 访问地址

http://lbsyun.baidu.com/apiconsole/custommap

 

2. 特色服务平台-个性化地图-新建。

打开后,有三种方式:

第一种根据模板选择:里面有些官方模板,根据场景分深色和浅色,根据行业分全部行业、出行行业、物流行业。如果对地图

          没有特殊需求的话,从中选择一个区别于官方标准地图样式已足够。

 

 

第二种根据配色色系选则:提供各种色系,然后地图根据选择色系自行调整。

 

 

第三种:根据图片的颜色进行配色:

可以从截图中看到,其实是提取了图片中对应不为的几种颜色作为色系进行地图渲染。作为某些logo或者场景进行定制是很不错的。

        

 

 4. 发布新创建的地图。

  可以在编辑器中直接选择发布,也可以在我的地图中,对选择的地图进行发布。 这里也可以通过点击下载样式文件,将样式下载为json文件, 后面调用。

 

 

发布成功后,有个样式ID,是后面调用时需要用到的。

 

5. 调用样式。

 从第4步,我们也能了解到,调用地图样式有两种方式,一种是通过样式ID调用,一种是通过样式JSON文件调用。

我们分别来看一下:

 第一种通过样式ID:

1 /**
2  * 使用样式ID设置地图样式
3  */
4 function setMapStyleFromId(){
5   map.setMapStyleV2({
6     styleId:'29f56e7ce69278af249c1182f10533c7' //此样式为测试用,随时可能会被删除,请修改为自己的ID
7  }); 

8 }

 

第二种通过调用JSON文件:此处 $ 需要引用jquery.

 1 /**
 2  * 使用样式Json文件设置地图样式
 3  */
 4 function setMapStyleFromJson() {
 5 
 6   $.getJSON('/bdMap/data/custom_map_config.json', function (json) {
 7     map.setMapStyleV2({
 8       styleJson: json
 9     });
10   });
11 }

 

6. 页面显示:

 

 

 

7. 参考代码

https://github.com/WhatGIS/bdMap

 

posted @ 2021-04-20 14:19  googlegis  阅读(4938)  评论(0编辑  收藏  举报

坐标合肥,非典型GIS开发人员 GitHub