- S09 我懂个P|工具篇(一)-我懂个P【设计大神阿文带你飞】(
- S09 我懂个P|工具篇(二)-我懂个P【设计大神阿文带你飞】(
- S09 我懂个P|工具篇(三)-我懂个P【设计大神阿文带你飞】(
- S03我懂个P|图片篇(五)-我懂个P【设计大神阿文带你飞】(学
- S04我懂个P|文字篇(三)-我懂个P【设计大神阿文带你飞】(学
- S04我懂个P|文字篇(一)-我懂个P【设计大神阿文带你飞】(学
- S04我懂个P|文字篇(二)-我懂个P【设计大神阿文带你飞】(学
- S06 我懂个P|配色篇我懂个P【设计大神阿文带你飞】(学习笔记
- S04我懂个P|文字篇(四)-我懂个P【设计大神阿文带你飞】(学
- S07 我懂个P|视频篇(一)-我懂个P【设计大神阿文带你飞】(
文章原创,最近更新:2018-06-09
课程内容:有了这些地图神器,再也不愁地图素材啦(一)
课程原链接:我懂个P【设计大神阿文带你飞】
在iCon篇中,我们推荐了四个强大的矢量图标库,已经满足我们90%的矢量素材需求了,但似乎还差了点什么。

我们似乎还不知道可编辑的矢量地图去哪找?

更别说做出这样的填充地图了

也别说这样的像素地图了

这节课,我将会带你找到三大地图宝藏。Ready Go
1.AmCharts
AmCharts是一个十分酷炫的国外图表组件库,别紧张,虽然看到了 JavaScript等字眼,但即使我们不懂代码,也能轻松玩转这个大家族里的两个组件!

在 AmCharts中的众多组件中,推荐两个最实用的给大家有了他们,就再也不愁却地图素材了!
-
FREE SVG MAPS
SVG格式地图下载器 -
PIXEL MAP GENERATOR
像素地图生成器
1.1FREE SVG MAPS
先来看第一个FREE SVG MAPS,顾名思义,这是 AmCharts旗下的一个免费矢量地图资源库,提供200多个地图矢量源文件下载.
可惜 FREE SVG MAPS没有搜索功能,在茫茫的国家中,如何一秒钟找到我要的国家?利用浏览器自带的查找快捷键:Ctrl+F,在右上角输入国家名,网页就会自动标亮搜索目标啦。

点进地图后,你会发现每个地图还提供两个版本下载:高精度版/低精度版。当然,建议大家直接下载高精度版。

素材下载下来后,又是我们最熟悉的SVG矢量格式了用A打开,然后用拖拽法直接拖进PPT,取消组合!!!

就这样,我们有了一个高度可编辑的中国地图其他国家的地图如此类推。

现在,要想做出这样的地图,不就是填格子上色的事儿么?

思考题,这样的填充地图怎么做?打开作业文件,先试试再往后翻呗。

原理不就是我们前面作业中多次使用的形状填充法么?(参考案例:课时:《审美篇:开眼:到专业的设计社区开眼(一)》)

操作步骤:
步骤1:
如果你的地图是散装的,请先重新组合在一起。快键键ctrl+G

步骤2:
准备一张图片素材,选中,按下Ctrl+C复制,作为备用。

步骤3:
选中形状,设置形状格式,把形状填充改为:图片或纹理填充》剪贴板》平铺为纹理

步骤4:
选中需要重新填色的省份,改变填充颜色即可,搞定!!!

继续思考题:这样的填充地图,你也会做了吗?打开作业文件,先试试再往后翻呗。

操作提示:
其实所有步骤跟上一个案例一样,只是一开始的组合的方式不同而已。我们把需要填充的两大部分,分别先组合起来,注意,是分别。
- 先把左边需要填充的省份组合在一起。

- 再把其余省份组合在一起。

- 这时,我们只需要对不同的部分填充不同的图片就OK啦~步骤就不啰嗦了。

课后作业1:
试试从 Free SVG Maps中下载一个你喜欢的国家地图。

课后作业2:
利用下载下来的地图,制作一个这样的填充地图,放进这个PPT试试。

参考答案:
来,晒晒你的国家吧

好,我们成功解锁了矢量地图库!接下来我们玩点不一样的。
1.2 PIXEL MAP GENERATOR
接下来说说PIXEL MAP GENERATOR
Pixel Map是图表工具 AMCHARTS的另一个神奇组件,顾名思义,专门用来制作像素地图。

这里提供各种映射效果,随便选,你看着舒服就行。

这个生成器集合了** FREE SVG MAPS**的所有地图,而且支持手动搜索,快速找到国家~

你还可以让整个陆地海洋变色

你还可以用【油漆桶】工具为特定的国家/地区上色。

你还可以往地图里添加线条,图标等元素。
但经过前面章节的学习后,我们已经看不上这些图标元素了还是安心搞地图吧~

开始了吗?已经结束了…只需一键,就能把地图变得不一样~~~!

当然,你还可以尝试其他样式,这里就不唠叨了

选好你想要的样式后,直接在右下角点击下载即可,多么亲切可爱的SVG格式!弹出的代码框不用管,直接下载按钮,搞定!

依然是老生常谈的拖拽法,拖进PPT大卸百块。

导入PPT后,加入相应的文字就可以拿出去见人了!

而且,你还可以随意修改配色,别忘了这是一张可编辑的图比如,我把地图放到一个渐变背景上,填充颜色改成白色,然后调整一下透明度试试~

同样地加上内容,这又是一张酷炫的地图型PPT了手痒了?做作业吧!

同样地加上内容,这又是一张酷炫的地图型PPT了!手痒了?做作业吧!

课后作业3:
利用P|XEL MAPGENERATOR生成器制作一张散点中国地图。

课后作业4:
尝试把用散点中国地图美化这页PPT。

参考答案:
来,晒晒你的作业吧~

现在,有了 AmCharts家族的这两款神器,你还担心做不出酷炫的地图么?
-
FREE SVG MAPS
SVG格式地图下载器 -
PIXEL MAP GENERATOR
像素地图生成器
如果你所在的部门是敏感部门,对地图要求极度政治正确那怎么办?别怕,请往下看!(比如:为什么中国地图没有南海部分?同志,你的思想觉悟有问题啊!)
知识点回顾
地图神器
神器一。Am Charts
- Free SVG Maps
- 如何下载矢量地图?
- 如何制作填充地图?
- Pixel Map generator
- 如何制作像素地图?
网友评论