前言

最近公司比较忙，也没时间发些博文，最近正好由于项目需要大屏展示地图，大屏多数都是使用暗蓝色底图，目前天地图不提供暗蓝色瓦片，自带的JS API只支持black和indigo，但项目要求必须要用天地图。搜索引擎找了找解决方案，也是花里胡哨的各种方式都有，最后决定用CSS的filter解决这个问题，在博客记录下解决方法。

灵感

blog.csdn.net/Corey_mengx…

通过这篇博文的介绍，大概确定了方向，就是用filter:url()加上预定义效果的函数调整出最终效果。

方法

1. 打开：CSS Filter 编辑器
2. 上传天地图的截图到编辑器，调整下方预设及右侧参数
3. 将svg预设放置在中，将编辑器中CSS Code的栏目所生成的CSS，加在天地图的canvas上面

如果预设没有想要的效果，可以使用SVG Gradient Map Filter，自己调出一个

效果展示

经过调整后的最终展示效果，谁能想到这竟然是天地图呢？