手工绘制地图方法步骤 教你如何制作手绘地图 - 聚巧网
您的位置： >
手工绘制地图方法步骤 教你如何制作手绘地图
[导读]虽然现在有很多绘制地图软件，但是手工绘制的地图更有情怀，那么如何制作手绘地图呢，下面的文章将告诉你，手绘地图经过下面五个步骤就能完成啦！
虽然现在有很多绘制地图软件，但是绘制的地图更有情怀，那么如何制作手绘地图呢，下面的文章将告诉你，手绘地图经过下面五个步骤就能完成啦！想纪念自己曾经去过的地方？想展现自己写的奇幻小说的世界架构？你都可以自己做张地图！只需按照下述步骤，向成为真正的制图员迈出第一步吧！
1绘制轮廓。用铅笔浅勾基本地形。在本文中，我们会用一张虚构世界的全景图作为范例。
如果是绘制大陆尺度的地图，画出海陆交界处。
如果是局域尺度的地图，勾出地理边界和政治边界。
尽量用质量好的纸来画地图。
2填色。调整好铅笔轮廓，然后用墨笔勾边。
如果你画的是彩色地图，挑选合适的底色来填充陆地和海洋。
在图上绘出罗盘图样以指示地图方向。
3画出地理要素。这是点睛之笔，读者据此能更直观地感受到地图所要表现的地方。
对大尺度的地图，你需要画出山脉、河流、海洋深度，还有其他大的地图要素。
对于小尺度的地图，可以画上溪流、篱笆，还有其他可以辨认的地标。
4标明比例尺。比例尺用来说明地图上的单位长度（英寸/厘米）和实际距离（英里/公里）之间的对应关系。有了比例尺，就可以通过地图来确定实际距离了。
在地图上空白处绘制。比例尺既可以直接画在地图里，也可以放在地图边框的部分，取决于你的地图细节。
5添加经纬网格。距离要均匀一致，线要直（最好用尺子）。
6标注地名。标上地点，方便读者知道自己看到了什么。
像山川河流和地标这些重要地形都应当标明。
如果你的地图是用来作为故事或小说的插图，那就应当把重要事件发生地点也标上。
如果你画的是纪念地图，那就把对你有重要意义的地点标出来。
7绘制图例。读者可以据此了解地图上的颜色、标记和线段的意义。
可以用渐变色来表示海拔高度和海洋深度。
如果你有用图标来表示地理要素，使用时务必在全图中保持一致。
先在废纸上打个草稿，再往好纸上画。
要有创意。大可以加上你自己的特效和装饰。
如果你觉得有帮助的话，在开始画图之前先大略估算一下要画的内容和面积。这有助于控制地图比例和总的呈现效果。不管你要画什么地图，尽量不要把时间花在绘制每一个小细节上，不然你会很快厌烦的。
你要是乐意的话，也可以画一张没有字的地图。
你要准备什么？
质量好的绘图纸
水彩笔，记号笔，颜料
电脑 （可选）
&原文地址：/view/12751.html
扩展阅读：&旅行的梦想并不遥远，只要一颗流浪四方的心。&&&唐人立。
最早认识唐人立的时候，他还是大二的学生。他独自完成了&南京20年规划地图&。几年前，他完成了自己的第一本著作，逃学去旅行《一个人走世界&&大学4年200城的旅行》。而现在，他正执行着他的&辞职去旅行&计划。他好心的老板还多给他发了一个月的工资。从南京，到台湾，从曼谷到斯里兰卡&&2个月来，唐人立走过太多地方。是他原创的图片和文字，让我渐渐对自助游产生了兴趣，并决定记录下旅游的每一刻。
于是，我开始着手制作了这个旅行地图。可能它还不够完善，但的确它能给我们带来太多的正能量。希望有越来越多的人，能够用这种方式，去记录自己的旅途。THX。
代码其实很简单，简单的地图展示，简单的覆盖物，简单的信息窗口。
你要做的，其实只是申请一个key：
然后将下面的代码复制到你的网站上，并使用你自己的key。
第一步、地图展示
中心点坐标可以通过坐标拾取工具来找：
地图级别在国内建议12-18，国外建议在4-6.
//初始化地图对象，加载地图
function mapInit(){
mapObj = new AMap.Map("iCenter",{center:new AMap.LngLat(121..239637),
level:17});
addBuildings();
第二步、添加覆盖物
覆盖物，就是marker，这里用的默认的覆盖物。蓝色的，挺好看。
//实例化点标记
function addMarker(){
marker=new AMap.Marker({
icon:"/images/marker_sprite.png",
position:new AMap.LngLat(116..907761)
marker.setMap(mapObj);
//在地图上添加点
第三步、添加信息窗口
信息窗口用了自定义信息窗口，因为觉得兰蓝色的比较好看。
自定义信息窗口，分为3个部分，头，中间，尾巴。
关闭按钮也可以使用自定义图片。
//构建自定义信息窗体
function createInfoWindow(title,content){
var info = document.createElement("div");
info.className = "info";
// 定义顶部标题
var top = document.createElement("div");
top.className = "info-top";
var titleD = document.createElement("div");
titleD.innerHTML =
var closeX = document.createElement("img");
closeX.src = "/images/close2.gif";
closeX.onclick = closeInfoW
top.appendChild(titleD);
top.appendChild(closeX);
info.appendChild(top);
// 定义中部内容
var middle = document.createElement("div");
middle.className = "info-middle";
middle.innerHTML =
info.appendChild(middle);
// 定义底部内容
var bottom = document.createElement("div");
bottom.className = "info-bottom";
var sharp = document.createElement("img");
sharp.src = "/images/sharp.png";
bottom.appendChild(sharp);
info.appendChild(bottom);
第四步、结果面板
结果面板只要是为了鼠标放在上面时，可以打开相应的信息窗口。
HTML结构：
&li&&a href="javascript:void(0);" onmouseover="myOpen2();"&曼谷&/a&&/li&
&li&&a href="javascript:void(0);" onmouseover="myOpen();"&斯里兰卡&/a&&/li&
信息窗口展开代码：
function myOpen(){
infoWindow.open(mapObj,marker.getPosition());
function myOpen2(){
infoWindow2.open(mapObj,marker2.getPosition());
--------------------------------------------------------------------------
全部源代码：
&!DOCTYPE HTML&
&meta http-equiv="Content-Type" content="text/ charset=utf-8"&
&title&逃学去旅行&/title&
&!-- 页面布局样式 --&
&link rel="stylesheet" type="text/css" href="/Public/css/demo.Default.css" /&
&script language="javascript" src="/maps?v=1.2&key=【您的key】"&&/script&
#iCenter{float:left;width:<span style="background-color: #f5f5f5; color: #px;height:<span style="background-color: #f5f5f5; color: #px;}
.infobox{float:left;width:<span style="background-color: #f5f5f5; color: #px;height:<span style="background-color: #f5f5f5; color: #px;text-align:center;padding:10px 0;background:#efefef;}
.infobox h1{margin:<span style="background-color: #f5f5f5; color: # 20px;}
.infobox li a{text-decoration:none;font-size:20px;width:<span style="background-color: #f5f5f5; color: #%;display:block;padding:30px 0;border:1px dashed #ccc;border-width:1px 0;}
.infobox li a:hover{background:#ccc;}
&body onLoad="mapInit()"&
&div id="iCenter"&&/div&
&div class="infobox"&
&h1&逃学去旅行2&/h1&
&li&&a href="javascript:void(0);" onmouseover="myOpen2();"&曼谷&/a&&/li&
&li&&a href="javascript:void(0);" onmouseover="myOpen();"&斯里兰卡&/a&&/li&
&script language="javascript"&
var mapObj,toolB
var marker,marker2;
//初始化地图对象，加载地图
function mapInit(){
mapObj = new AMap.Map("iCenter",{center:new AMap.LngLat(88.505859,21.371244),level:4});
//地图中添加地图操作ToolBar插件
mapObj.plugin(["AMap.ToolBar"],function(){
toolBar = new AMap.ToolBar();
mapObj.addControl(toolBar);
//地图初始化时，在地图上添加一个marker标记,鼠标点击marker可弹出自定义的信息窗体
addMarker();
//添加marker标记
function addMarker(){
mapObj.clearMap();
marker = new AMap.Marker({
map:mapObj,
position:new AMap.LngLat(79.914551,6.871893), //位置-斯里兰卡
icon:"/images/0.png" //复杂图标
marker2 = new AMap.Marker({
map:mapObj,
position:new AMap.LngLat(100.546875,13.731381), //位置-曼谷
icon:"/images/0.png" //复杂图标
AMap.event.addListener(marker,'mouseover',function(){ //鼠标点击marker弹出自定义的信息窗体
infoWindow.open(mapObj,marker.getPosition());
AMap.event.addListener(marker2,'mouseover',function(){ //鼠标点击marker弹出自定义的信息窗体
infoWindow2.open(mapObj,marker2.getPosition());
//实例化信息窗体
var infoWindow = new Window({
isCustom:true,
//使用自定义窗体
content:createInfoWindow('斯里兰卡&&&span style="font-size:11color:#F00;"&采茶人&/span&',"&img src='taoxue_1.jpg' style='width:92float:margin:0 5px 5px 0;'&&img src='taoxue_2.jpg' style='width:92float:margin:0 5px 5px 0;'&&img src='taoxue_3.jpg' style='width:92float:margin:0 5px 5px 0;'&尽管斯里兰卡人民并不富裕，但是他们对生活很满足。每一个微笑的斯里兰卡人的脸上，更多的是他们对待生活的热情。&a href='/'&@唐人立逃学去旅行&/a&"),
size:new AMap.Size(300, 0),
offset:new AMap.Pixel(0, -50)//-113, -140
var infoWindow2 = new Window({
isCustom:true,
//使用自定义窗体
content:createInfoWindow('曼谷&&&span style="font-size:11color:#F00;"&泰国泼水节&/span&',"&img src='taoxue_7.jpg' style='width:92float:margin:0 5px 5px 0;'&&img src='taoxue_6.jpg' style='width:92float:margin:0 5px 5px 0;'&&img src='taoxue_5.jpg' style='width:92float:margin:0 5px 5px 0;'&如果说青春是一场说走就走的旅行，那么泰国的泼水节才更好地诠释着什么是青春。一起疯狂吧！&a href='/'&@唐人立逃学去旅行&/a&"),
size:new AMap.Size(300, 0),
offset:new AMap.Pixel(0, -50)//-113, -140
//构建自定义信息窗体
function createInfoWindow(title,content){
var info = document.createElement("div");
info.className = "info";
// 定义顶部标题
var top = document.createElement("div");
top.className = "info-top";
var titleD = document.createElement("div");
titleD.innerHTML =
var closeX = document.createElement("img");
closeX.src = "/images/close2.gif";
closeX.onclick = closeInfoW
top.appendChild(titleD);
top.appendChild(closeX);
info.appendChild(top);
// 定义中部内容
var middle = document.createElement("div");
middle.className = "info-middle";
middle.innerHTML =
info.appendChild(middle);
// 定义底部内容
var bottom = document.createElement("div");
bottom.className = "info-bottom";
var sharp = document.createElement("img");
sharp.src = "/images/sharp.png";
bottom.appendChild(sharp);
info.appendChild(bottom);
//关闭信息窗体
function closeInfoWindow(){
mapObj.clearInfoWindow();
function myOpen(){
infoWindow.open(mapObj,marker.getPosition());
function myOpen2(){
infoWindow2.open(mapObj,marker2.getPosition());
页面地址：
阅读(...) 评论()第一步 创建地图
当前城市：北京市 切换
当前地图中心点经纬度：
当前地图级别：
宽度：像素
高度：像素
样式：标准精简
位置：左上右上
地图缩略图
状态：展开收起
位置：左上右上
地图比例尺
单位：公制英制
位置：左上右上
鼠标滚轮缩放
键盘方向移动
鼠标拖动地图
鼠标双击放大
还没有在地图上添加点标记，点击上面的按钮开始在地图上添加点标记
第二步 获取代码
通过示例的方式为查找并为您的地图添加更多的功能和控件
通过代码的方式查找您需要的功能和地图控件
(C)2015 Baidu}