flash地图的制作教程

flash，大家或多或少都有所了解。比方上网，处处都能看到flashflash应用也是五花八门。今日我们讲的是用flash现在在网上随处都能找到电子地图，其中大局部都是java开发的，其有用flashflash“中国电子地图网“里面的地图就是用flash做的。还有九江，五邑等地图也都是用flash来完成的。现在我们就来学习用flash地图，你需要一点一点的看，还要找怎么去。而电子地图就不一样了，你可以搜寻，就直接标出那个地方，还可以告知你几路公交车到，四周有什么宾馆，饭店等等。所以，电子地图一般要具备的功能是:放大，缩小，移动，地点链接(信任介绍)，搜寻，等一系列功能。这么大的数据量是不愿保存在flash图层的动态载入，实现数据的模糊，智能，区域查询等功能。废话少说，首先我们来生疏flash的mc(影片剪辑)，已经做电子地图所用到的几个属性。如下：_x//相对于父级影片剪辑的本地坐标的x统将舞台的左上角作为(0,0)。_y//相对于父级影片剪辑的本地坐标的y统将舞台的左上角作为(0,0)。_width//影片剪辑的宽度，以像素为单位。_height//影片剪辑的高度，以像素为单位。_xscale//确定从影片剪辑注册点开头应用的影片剪辑水平缩放比例。默认注册点为(0,0)。_yscale//设置从影片剪辑注册点开头应用的影片剪辑垂直缩放比例。默认注册点为(0,0)。利用鼠标和键盘来完成地图的放大、缩小、拖动等功能：startDrag函数//执行startDrag操作后，影片剪辑将保持可拖动状态。stopDrag函数//startDrag根本上就这么多了，一会遇到那个再具体讲。下面我们一步一步来做电子地图：一、首先我们翻开flash440px高：316。〔依据你的需要来设定〕。880╳632〔这样放大时效果会好很多〕，导入到库中。然后翻开库，选择地图拖入到场景中，转换成影片剪辑，注册点选则中心，这样放大缩小就以这个地图的中心为中心了。取名为map_mc〔重要的事下面的名字〕。由于程序要掌握这个地图，所以要给他起个名字。三、好了，地图剪辑建好了，我们就开头用程序掌握他了。首先，我们来实现放大缩小。有的介绍的是用_width和_height_xscale_yscale_xscale_yscale直接就是原大小的百分比。建一个图层，选中然后在场景中画个方块，转换成按钮〔和地图一样，不过次选择的是按钮〕。给按钮命名为fangda_btn，选择这个按钮，翻开动作面板写上如图的程序：同理建立缩小和复原的按钮。放大按钮上的程序：on(press){//当鼠标按下的时候执行下面的程序map_mc._xscale=map_mc._xscale+10;//x10map_mc._yscale=map_mc._yscale+10;//y10}缩小按钮上的程序：on(press){//当鼠标按下的时候执行下面的程序map_mc._xscale=map_mc._xscale-10;//x10map_mc._yscale=map_mc._yscale-10;//y10}复原按钮上的程序：on(press){//当鼠标按下的时候执行下面的程序map_mc._xscale=100;//地图在xmap_mc._yscale=100;//地图在y}在时间轴上的程序：〔由于拖动的四地图，不用按钮，固然，其他的也可以写到时间轴上〕map_mc.onMouseDown=function{//当鼠标按下的时候执行startDrag(map_mc);//鼠标可以拖动地图}map_mc.onMouseUp=function{//当鼠标弹起〔不按时〕stopDrag;//停顿拖动}最终，大家可能会觉察，假设始终缩小，就会消灭问题，后来反而变大了，拖动可以把地图拖出去，这些都不是我们想要的效果，我们下一次会特地讲解这个问题，在这先透露一下，欢送大家一起沟通探讨。以吧。我们一步一步来深入，以到达真正的电子地图。假设大家按上一篇教程问题，另外还有信息的显示等一些内容。容会随着地图的放大缩小自动隐蔽和显示等问题。好了，废话少说，下面我们来看看今日要学习的主要内容：限制地图的放大和缩小限制地图的边界内容的显示和隐蔽两点间距离的测量主要用到的actionscript代码〔除上节讲的以外〕如下：_visibleTrue为可见false为不行0.1Math.floor 返回由参数x指定的数字或表达式的下限值数字或表达式的最接近的整数。Math.floor(12.5)的值为12 Math.floor(-6.5)的值为-7。Math.pow〔〕计算并返回x的y次幂。Math.pow〔x，y〕表示x的y次方。Math.sqrt 计算并返回指定数字的平方根。Math.sqrt(16)的值为4。lineStyle〔〕设置线条的样式。lineStyle〔3，0xff0000，100〕表示要画的线的粗3px，颜色为红色，100，不透亮。moveTo 将当前绘画位置移动到(x,y败，并且当前绘画位置不转变。lineTo 使用当前线条样式绘制一条从当前绘画位置到(x,y)的线条；当前绘画位置随后会设置为(x,y)。假设正在其中绘制的影片剪辑包含用Flash绘画工具创立的内容，则调用lineTo方法将在该内容下面进展绘制。假设在对moveTo进展任何调用之前调用了lineTo，则当前绘画位置默认为(0,0)。假设缺少任何一个参数，则此方法将失败，并且当前绘画位置不改变。createEmptyMovieClip 创立一个空影片剪辑作为现有影片剪辑的子级行为类似于attachMovie方法，但是不必为的影片剪辑供给外部链接标识符。创立的空影片剪辑的注册点为左上角。假设缺少任意一个参数，则此方法将失败。createTextField 创立一个的空文本字段作为在其上调用此方法的影片剪辑的子级。removeTextField 删除文本字段。只能对使用MovieClip.createTextField执行此操作。当调用此方法时，将删除文本字段。这次的根本上就这么多了，下面我们一步一步来实现今日的内容。1、我们要实现的效果就是一步一步实现数据显示和隐蔽，首先我们来创立一个地图元件，命名为map_mc。双击进去编辑这个元件，再创立45路，政府单位，中等路，单位，小路。在各自的图层分别写入各自的内容。分别命名为：map1_mc、map2_mc、map3_mc、map4_mc、map5_mc。〔如右图〕2、这步我们就要建功能按钮，我们把他们放到左面，我们先来建一个放大的元件，首先画一个放大的图标，按F8，建一个名为fangda_mc〔如以下图〕32suoxiao_mcyuantu_mctuodong_mc(拖动)、celiang_mc(测量)。4、放大、缩小、拖动、复原上节多已经讲过了，但随着功能的增多，会越来越乱，所以我码和自定义函数：//停顿播放stop;//放大，缩小，复原，拖动，测量的掌握变量varchengxu;//全部左边功能按钮的初始化函数〔把左边功能按钮都停顿在第一帧〕functionchushi{_root.fangda_mc.gotoAndStop(1);_root.suoxiao_mc.gotoAndStop(1);_root.yuantu_mc.gotoAndStop(1);_root.tuodong_mc.gotoAndStop(1);_root.celiang_mc.gotoAndStop(1);}//初始化地图函数〔把先不要显示的都隐蔽〕functionchushimap{_root.map_mc.map2_mc._visible=0;_root.map_mc.map3_mc._visible=0;_root.map_mc.map4_mc._visible=0;_root.map_mc.map5_mc._visible=0;}//执行初始化地图函数〔把先不要显示的都隐蔽〕chushimap;//初始化功能提示函数functiongongnengtishi{_root.fangda_mc.fangda1._visible=0;_root.suoxiao_mc.suoxiao1._visible=0;_root.yuantu_mc.yuantu1._visible=0;_root.tuodong_mc.tuodong1._visible=0;_root.celiang_mc.celiang1._visible=0;}//执行初始化功能提示函数〔把提示隐蔽〕gongnengtishi;//地图区域限制函数〔限制地图脱离屏幕〕functionxianzhi{_root.onEnterFrame=function{if(map_mc._x>320*map_mc._xscale/200){map_mc._x=320*map_mc._xscale/200}if(map_mc._x<320-320*map_mc._xscale/200){map_mc._x=320-320*map_mc._xscale/200}e/200}}

if(map_mc._y>240*map_mc._yscale/200){map_mc._y=240*map_mc._yscale/200}if(map_mc._y<240-240*map_mc._yscale/200){map_mc._y=240-240*map_mc._yscal}//信息的显示和隐蔽函数〔放大显示和缩小隐蔽〕functionxianshi{vardx=_root.map_mc._xscale;if(dx>=120){_root.map_mc.map2_mc._visible=1;if(dx>=140){_root.map_mc.map3_mc._visible=1;if(dx>=160){_root.map_mc.map4_mc._visible=1;if(dx>=180){_root.map_mc.map5_mc._visible=1;}else{

}else{}

_root.map_mc.map5_mc._visible=0;_root.map_mc.map4_mc._visible=0;_root.map_mc.map5_mc._visible=0;}}else{_root.map_mc.map3_mc._visible=0;_root.map_mc.map4_mc._visible=0;_root.map_mc.map5_mc._visible=0;}}else{chushimap;}}//测量函数functionceliang{varsx,sy;_root.map_mc.cl_mc.clear;_root.map_mc.cl_mc.cl_txt.removeTextField;sx=_root.map_mc._xmouse;sy=_root.map_mc._ymouse;draw=true;onMouseMove=function{if(draw){_root.map_mc.createEmptyMovieClip(“cl_mc“,1);_root.map_mc.cl_mc.lineStyle(1,0x009900,80);_root.map_mc.cl_mc.moveTo(sx,sy);_root.map_mc.cl_mc.lineTo(_root.map_mc.cl_mc._xmouse,_root.map_mc.cl_mc._ymouse);ttt=Math.floor(Math.sqrt(Math.pow(_root.map_mc.cl_mc._width,2)+Math.pow(_root.map_mc.cl_mc._height,2)));_root.map_mc.cl_mc.createTextField(“cl_txt“,1,_root.map_mc.cl_mc._xmouse,_root.map_mc.cl_mc._ymouse-22,100,22);_root.map_mc.cl_mc.cl_txt.text=ttt+“m“;}};onMouseUp=function{draw=false;}};5、Map_mc〔map_mc的全部功能〕：_root.map_mc.onPress=function{if(chengxu==“fangda“){if(_root.map_mc._xscale<200){_root.map_mc._xscale+=10;_root.map_mc._yscale+=10;xianshi;}}elseif(chengxu==“suoxiao“){if(_root.map_mc._xscale>100){_root.map_mc._xscale-=10;_root.map_mc._yscale-=10;xianshi;}}elseif(chengxu==“yuantu“){_root.map_mc._xscale=100;_root.map_mc._yscale=100;_root.map_mc._x=160;_root.map_mc._y=120;chushimap;}elseif(chengxu==“tuodong“){startDrag(_root.map_mc,false);xianzhi;}elseif(chengxu==“celiang“){celiang;}}_root.map_mc.onRelease=function{stopDrag;}6、左边功能按钮的功能代码即功能提示代码：//leftfangda_mc.onPress=function{chushi;_root.fangda_mc.gotoAndStop(2);chengxu=“fangda“;}suoxiao_mc.onPress=function{chushi;_root.suoxiao_mc.gotoAndStop(2);chengxu=“suoxiao“;}yuantu_mc.onPress=function{chushi;_root.yuantu_mc.gotoAndStop(2);chengxu=“yuantu“;}tuodong_mc.onPress=function{chushi;_root.tuodong_mc.gotoAndStop(2);chengxu=“tuodong“;}celiang_mc.onPress=function{chushi;_root.celiang_mc.gotoAndStop(2);chengxu=“celiang“;}//leftfangda_mc.onRollOver=function{_root.fangda_mc.fangda1._