flash地图制作:flash在有限的页面内制作大的地图

  多个朋友因工作或爱好需要询问如何用flash在有限页面内制作大地图并链接、显示有关地点信息为此将我自己做个记录旅游地点flash地图略作精简、修改做了这个flash并将关键部分做法介绍如下(原有那个包括显示信息中文字和采用旅游照片将近10 M太大了无法上传)

  作品见下方(好久没发帖了不知该如何发swf文件了把考屏图放下面方便了解)

flash在有限<img src='/icons/87028de.gif' />页面内制作大<img src='/icons/87028de.gif' />地图

  特点:

  缩小地图以适应页面大小局限用放大镜来放大缩小了地图使能清晰看到需要细节使用AS纠正普通遮罩制作放大镜错位较大缺陷放大部分在镜片中心(红十字处)没有错位用鼠标经过、离开按钮AS来控制显示有关需要信息(作品中鼠标在放大镜中心红十字处)

  地图窗口大小同选地图长宽要成比例如果页面合适也可以让信息同时在地图窗口右边或下面显示我自己做记录旅游地点地图文字信息是在右边显示用组件加滚动条;照片用MC元件位置在地图窗口内循环播放这样显示信息量可以非常大(信息显示另做法)

flash在有限<img src='/icons/87028de.gif' />页面内制作大<img src='/icons/87028de.gif' />地图

  本作品仅作为示意1、各地朋友千万不要在地理问题上拍砖哦2、些距离太近城市偷懒没设定信息显示链接(解决办法是缩小按钮反应面积)3、为便于上传地图只放大了1倍图片品质也选定得很低4、同样示意中只有北京同时采用显示1张图片

  做法介绍:

  1、各图层拷屏如图2为了容易看清做法图层分得细了些

  舞台(或地图窗口)大小同选地图长宽要成比例(便于满舞台显示不变形)我用舞台是400*330地图是800*660(这2个尺寸在下面帧动作中要用)只放大1倍放大倍数可自己确定只需在步骤7帧动作AS中改动相应数据即可

  友情提示:如果地图窗口小于舞台地图窗口坐标应该是(00)图 2:

flash在有限<img src='/icons/87028de.gif' />页面内制作大<img src='/icons/87028de.gif' />地图

  2、新建电影剪辑元件(即MC)“地图元件”把选定地图图片导入图片X、Y坐标都是0即左上角对着元件界面 + 处简单办法是选中图片打开属性面板把X、Y 都改为0然后用Enter键确定

  3、把做好MC拖入场景“小图”图层中在场景属性中设定MC坐标为(00)宽、高数值同舞台然后用Enter键确定

  4、把做好MC再拖入场景“大图”图层中MC在场景中坐标也设定为(00)选中“大图”图层中MC在属性中命名为aa

  5、做放大镜

  新建MC元件“放大镜元件”画圆左右上下均必须居中用剪切、粘贴到当前位置办法把圆色块和边框分别放在2个图层中把镜片图层中颜色块转换为MC元件“镜片元件”在“放大镜元件”中选中镜片MC在属性中命名为ee颜色块是做遮罩用在swf文件中看不到它只是在有颜色部分能看到被遮蔽“大图”图层中画面所以颜色任意镜框在swf文件中是看得到颜色、式样自定再增加1个图层放十字线同镜框样在swf文件中是看得到用“极细”线

  友情提示:如果工作中需要比例尺也可经过计算把十字线设定为比例尺计算法如下:

  每格标注距离=每格对应地图上两点间实际距离*每格像素/地图上该距离像素

  实际操作可以测定在地图上已知距离水平(或竖直)两点的间像素值计算出1个像素在地图上是多少公里再确定镜片上每格几个像素标定比例尺

  6、把“放大镜元件”MC拖入场景放大镜图层选中放大镜MC命名为ff

  7、AS

  回顾上面已经分别为3个MC命名了命名应该同下面AS中不能搞错

  场景中大地图MC命名为aa

  场景中放大镜MC命名为ff

  放大镜元件中放大镜镜片MC命名为ee

  在AS图层选中帧写如下帧动作

  _root.onEnterFrame = function {

  Mouse.hide;//隐藏鼠标

  startDrag("_root.ff", true);// 控制望远镜ff随鼠标移动

  _root.aa.Mask(_root.ff.ee) //用ff中ee遮蔽aa

  _root.aa._x=_root._xmouse*(1-80/40);//用鼠标坐标控制大画面x坐标跟随

  _root.aa._y=_root._ymouse*(1-66/33);//用鼠标坐标控制大画面y坐标跟随

  }


  放大镜中有看得见和看不见两种图形所以用AS脚本控制遮罩

  _root.aa.Mask(_root.ff.ee)

  即用ff中ee遮蔽aa——括号内是遮蔽MC前边是被遮蔽MC

  用鼠标坐标控制大画面跟随

  _root.aa._x=_root._xmouse*(1-800/400);//用鼠标坐标控制大画面x坐标跟随

  _root.aa._y=_root._ymouse*(1-660/330);//用鼠标坐标控制大画面y坐标跟随

  按我计算要保持不错位放大图片aax坐标应该是:(1—放大倍数)乘以鼠标x坐标值(同样y坐标也是这么计算)现在画面放大倍数是800/400因此

  _root.aa._x=_root._xmouse*(1-800/400);

  800是本作品地图宽400是flash舞台宽度(可以约分怕介绍说明太费事了)制作时要根据自己作品地图和flash实际像素大小更改

  同样_root._ymouse*(1-660/330)中也这样

  8、在“地图元件”中增加按钮在“地图元件”中增加1个图层放按钮分别选中每个按钮写上AS以“北京”为例AS如下:

  (rollOver) {

  _root.gotoAndStop(2);

  }

  on (rollOut) {

  _root.gotoAndStop(1);

  }


  按键设在MC地图元件中却是控制场景动作所以在AS中加了_root.on (rollOver)时 gotoAndStop哪就在那帧上制作需要信息本作品北京信息制作在第2帧因此gotoAndStop(2)共在31个城市制作了信息示意on (rollOut)都是回到第1帧

  友情提示;

  按上面控制地图移动办法鼠标要停留在某个特定点上(例如本例中闪动红圆)实际上只能是在flash中个特定位置上因此只要避开这个位置尽可以随意安排需要显示信息位置、大小及数量本例中只有1个拉萨信息因被遮挡放右边

  如果页面合适也可以让文字、图片信息同时在地图窗口的外右边或下面显示但要在左边、上边显示则地图坐标计算会复杂许多没有必要

  其他部分常规制作从源文件中即可目了然不再介绍

Tags:  uu地图flash版 flash电子地图 flash地图 flash地图制作

延伸阅读

最新评论

发表评论