发布
设计素材站

#楼主# 2019-8-15

跳转到指定楼层

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
qOZd3ikpv6573KVo.jpg



大家好!

最近设计界发生了不少事

不仅Pinterest和Behance再次被墙

之前和大家推荐的地图神器也因为某些原因壮烈牺牲



ZH2KRJuWPjpZXW00.jpg



好在天无绝人之路

靠地图续命的设计师

还有一根大腿可以抱

这就是部分设计老手再熟悉不过的


Mapbox




smCp95qsGmRGIICP.jpg

看着这全新的界面和高大上的介绍

颇有士别三日当刮目相待之感



如今的mapbox将自己定义为实时地图平台

支持mapbox+eCharts大数据可视化

VKaVvh63dvS8UaU2.jpg



支持提供API端口接入

和多系统SDK导航等智能应用

SDBu8pDz35boS5zs.jpg



甚至还有
反抗现实(defy reality)

这种称呼比虚拟现实还霸气的功能

D0W9HVoTq0DUo9do.jpg



但对只要底图的画图狗而言,以上都是花架子


最有用的还是其功能日益强大的风格编辑器

以及隐藏的分析图功能


V6ffs9gjgWGo9fRs.jpg

p1xDHkPr5K5RHbPn.jpg



mapbox目前可以直接使用的地图风格有14种

IPpNpYEnnytZpR8S.jpg

h9dzmct6jDtXeSYM.jpg

JhOJ6rv6B8lEyj3N.jpg

THLppcPVPLPP9VPM.jpg



要实现自定义底图+分析图功能就要借助其核心模块



MAPBOX STUDIO

自定义地图



自定义地图可以13种现有的地图风格上

进行编辑和再创作


J3oDaf3O03N3Dj3T.jpg



以默认的基本模板为例

界面左侧是当前地图样式包含的各个图层
以及对应的控制选项和调节参数

OzZp266CAKgO4rbL.jpg



作用是像PS那样调节右侧矢量地图的颜色、透明度、描边、缩放、偏移等属性

没有特别高深难懂的地方


nloHMaHiKif6mm67.jpg



界面右上角的历史记录面板可以随时还原操作

类似于OSM的撤销/重做


L79L1R7AHlmG1l7L.jpg


如果只是这样
mapbox倒也和其他地图工具没什么区别

要在点击了左上角的选择数据选项后

mapbox的画分析图天赋才能展现


Exy4J7GGJtYY77Ec.jpg


类似于CAD线稿的黑底是mapbox自带的Mapbox Streets v8模式

绿色色块是当前所选图层

因此这一功能主要在于突出显示所选的图层从而起到筛选数据的作用

pTJo4lo4alvEULll.jpg



鼠标点击底图任意一点,都会显示该处对应的图层

方便精确筛选图层


u7ls7v5IFCj7F2G9.jpg

遗憾的是无法自定义可见/过滤图层的颜色



被选中的图层可以用色块、线框、点、点+线、热力图等多种方式呈现

也就意味着可以省去在底图上P图填色美化的功夫!


sZZOP7o6u9114ps2.jpg


利用图层过滤功能,则可以过滤或者反向筛选出对应的图层

从而实现要素分类,如路网(图中红色为过滤图层)


hvkO99CjddNv13jy.jpg

ahtQ4qbjChMjT4uT.jpg


嫌样式不好看或不够醒目可以将类型从线切换成点

就得到了一张自带特效的路网分布图


SYbBQEN5yBKiohMe.jpg


还可以利用过滤功能进行简单的反向筛选演示

(此时绿色为过滤图层)

ii7wI3jJx9JwX7xZ.jpg


可以通过调节缩放范围

来查看更大范围的筛选结果

ab9S3DB5CBSqUdCl.jpg


除了这种CAD风格的地图

还可以切换到其他风格

比如自带地形的风格


M55WM7e5pep5D25e.jpg


看看局部效果

b1gzJG5UFnFxj7C3.jpg


也可以通过在样式选择数据界面之间切换

寻找最好的呈现效果


o4TTeT4Y0MMD575y.jpg


切换后别忘了调节底图参数

UGlsrL0rRg7Rd9VU.jpg

iolw0Uk39wLs8cav.jpg


最后,得到一张交通站点分布图▼


ecxXwXaF2tCGbbBx.jpg


一些画起来费时费力的分析图
结合这种方法可以轻松搞定

绿地分布热力图结合灰色底图
YAAsOZ2zow0sNswn.jpg

结合卫星底图▼

zkO90a8Lfuff84e4.jpg


水系分布热力图结合卫星底图▼

MFmgSdRqyL5gcYbz.jpg


灵活多变和极高的自由度是mapbox工具的最大优势

而要说撸图的诀窍其实也没有

好看就完事了


实在不会用,可以参考mapbox官方视频教程

地址:https://www.mapbox.com/videos/


那么,愉快地撸图去吧!

—END—



13 (1).GIF



yyl. 发表于 2019-8-27 16:43:22
怎么设置成中文的?
B Color Link Quote Code Smilies