网站开发之Google地图的应用

Ｆ　…　…　……　…　。…　实用第一　智慧密集　．　…　…　…　，　……　３．２性能　Ｇｏｏｇｌｅ地图要在自己的网站上显示自然也要有相应的条　ｖａｒ　ｌａｔｌｎｇ＝ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ（２９．７５３８６５８３３４２１　８．一　９５．３４６０５１３６７９０１３∥定义地图窗口默认显示的地理位置。　）：　ｖａｒ　ｍｙＯｐｔｉｏｎｓ＝｛　件，这里所说的条件就是支持地图功能的底层环境。　对于Ｇｏｏｇｌｅ地图的应用要求为以下两条：　（１）浏览器必须是ＩＥ６或其以上版本，因为ＪａｖａＳｃｒｉｐｔ是　运行在ＩＥ浏览器中的，而Ｇｏｏｇｌｅ地图又是ＪａｖａＳｃｒｉｐｔ编写脚　本的，因此浏览器的功能至关重要。。　ｚｏｏｍ：１３　／／定义地图默认的缩放比列　ｃｅｎｔｅｒ：ｔａｔ　ｎｇ，　ｓｔｒｅｅｔＶｉｅｗＣｏｎｔｒｏｈ　ｆａｌｓｅ，　ｐａｎＣｏｎｔｒｏｌ：ｆａｌｓｅ。　（２）由于要调用谷歌提供的服务，所以在应用地图前必须　引入谷歌的开发包．基础ＪａｖａＳｃｆｉｐｔ包地址为：ｈｔｔｐ：／／ｍａｐｓ．　ｍａｐＴｙｐｅｌｄ：ｇｏｏｇｌｅ．ｍａｐｓ．ＭａｐＴｙｐｅｌｄ．ＲＯＡＤＭＡＰ）：　／／定义地图显示模式是路况地图还是卫星也图　ｇｏｏｇｌｅ．ｃｏｍ／ｍａｐｓ／ａｐｉ／ｊｓ？ｓｅｎｓｏｒ＝ｔｒｕｅ。如果要在地图上实现一些特　别的功能则必须再引入专用包（如实现在地图上做文字标记的　ｍａｐｌａｂｅ１．ｊｓ）。　３．３可靠性与可用性　Ｇｏｏｇｌｅ　ＭＡＰ　ＡＰＩ　ｖ３所兼容的浏览器为：　（１）ＩＥ　６．０＋（Ｗｉｎｄｏｗｓ）以及ＩＥ内核的其他浏览器，如：　搜狗高速浏览器、遨游浏览器、３６０浏览器、世界之窗浏览器　等。　（２）Ｆｉｒｅｆｏｘ　２．０＋（ＷｉｎｄｏｗｓｌＭａｃｌＬｉｎｕｘ）　（３）Ｓａｆａｒｉ　３．１＋（ＭａｃｌＷｉｎｄｏｗｓ）　（４）ｃｈｒｏｍｅ谷歌浏览器（Ｗｉｎｄｏｗｓ）　（５）ｏｐｅｒａ　１０＋（Ｗｉｎｄｏｗｓ）　由此看见Ｇｏｏｇｌｅ　ＭＡＰ　ＡＰＩ　ｖ３兼容现在主流的多个版本的　浏览器。　４系统实现　４．１　搭建Ｇｏｏｇｌｅ地图只用来显示的区域　首先．不讨论地图上的各种功能．先将一张空的地图窗口　显示在自己的网页上．这自然是实现各种地图功能的基础和先　决条件。　第一步．在ｈｔｍｌ头标记＜ｈｅａｄ＞＜／ｈｅａｄ＞中引入Ｇｏｏｇｌｅ地图　基本的ＪａｖａＳｃｒｉｐｔ包，代码为：　＜ｓｃｒｉｐｔ　ｔｙｐｅ＝＇ｔｅｘｔ／ｊｆａｖａｓｃｒｉｐｔ　ｓｒｃ＝　ｈｔｔｐ：／／ｍａｐｓ．ｇｏｏｇｌｅ．ｃｏｍ／　ｍａｐｓ，ａｐｉ／ｊｓ？ｓｅｎｓｏｒ＝ｔｒｕｅ　＞＜／ｓｃｒｉｐｔ＞　第二步．在＜ｂｏｄｙ＞＜／ｂｏｄｙ＞标记内定义地图窗１３：的ｄｉｖ层，　代码为：　＜ｄｉｖ　ｉｄ＝　ｍａｐ＿ｃａｎｖａｓ‘ｓｔｙｌｅ＝　ｗｉｄｔｈ：１２００ｐｘ；ｈｅｉｇｈｔ：８００ｐｘ　＞（｜　ｄｉｖ＞　以上代码在网页内容区域定义了地图要显示的窗口层，以　及这个窗口的宽和高。　第三步，在＜ｈｅａｄ＞＜／ｈｅａｄ＞标记内，写入Ｇｏｏｇｌｅ　ＭＡＰ　ＡＰＩ　调用代码：　＜ｓｃｒｉｐｔ　ｔｙｐｅ＝　ｔｅｘｔ／ｊａｖａｓｃｒｉｐｔ　＞　ｖａｒ　ｍａｐ；／／定义地图对象　ｆｕｎｃｔｉｏｎ　ｉｎｉｔｉａｌｉｚｅ（）｛∥网页打开时将执行此方法　Ｒ　８　２０１３．０１．．．．　．　．。电硒鞲栏靛的暑氍＿　））：　＜／ｓｃｒｉｐｔ＞　通过以上代码提供的功能现在就可以在自己的网页上显示　一张空地图了，地图默认显示的是美国，　：斯敦市．地图的默认　缩放比例为１３（如图５、图６所示）。　图７　图８　实现代码为根据ＧｏｏＳｅ　ｍａｐ　ａｐｉ在：　ｍａｐＴｙｐｅｌｄ：ｇｏｏｇｌｅ．ｍａｐｓ．ＭａｐＴｙｐｅｌｄ．ＲＯＡＤＭＡＰ）：　之后加入以下代码：　ｍａｐ＝ｎｅｗ　ｇｏｏｇｌｅ。ｍａｐｓ．Ｍａｐ（ｄｏｃｕｒｎｅｎｔ．ｇｅｔＥｌｅｍｅｎｔＢｙｌｄ　《　ｍａｐ＿ｃａｎｖａｓ　）　ｍｙＯｐｔｉｏｎｓ）；　ｖａｒ　ｌａｔｌｎｇｌ＝ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．Ｌａｔ［．ｎｇ（２９．７５０１　８００，一　９５．３４９９９０４）：／／定义星标点的位置　ｖａｒ　ｍａｒｋｅｒ１：ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．Ｍａｒｋｅｒ（｛　ｐｏｓｉｔｉｏｎ：ｌａｔｌｎｇｌ　ｍａｐ：ｍａｐ，　

……　ＧＲＡＰＨＩＣＳ　ＡＮＤ　ＩＭ＾ＢＥ　ＰＲＯＣＥＳＳＩＮＧ………　……………………………………　…１　＂…　……‘　…ｒ＿……　ｔｉｔｌｅ：，１＿Ｃａｐｉｔｏｌ　Ｏａｋｓ，｝）：／／定义星标点的提示文本　ｇｏｏｇｌｅ．ｍａｐｓ．ｅｖｅｎｔ，ａｄｄＬｉｓｔｅｎｅｒ（ｍａｒｋｅｒｌ，＂ｃｌｉｃｋ“，ｆｕｎｃｔｉｏｎ（）｛　ｗｉｎｄｏｗ．１ｏｃａｔｉｏｎ．ｈｒｅｆ＝　ｃａｖａｈｏｍｅ　ａｓｐｘ？ｉｄｃｉａ＝　１　０１＆ｗｅｂｃｉａ＝（１　０１）＆ｗｌｉｎｋ＝７　））：　细心的读者可能已经发现，在这个星标点也也定义了鼠标　点击事件的驱动代码，就是说如果鼠标单击此星标点，那么　ＪａｖａＳｃｒｉｐｔ将捕获此事件并作出相应的动作，这就是ｇｏｏｇｌｅ．　ｍａｐｓ．ｅｖｅｎｔ．ａｄｄＬｉｓｔｅｎｅｒ（ｍａｒｋｅｒｌ，”ｃｌｉｃｋ”，ｆｕｎｃｔｉｏｎ　０一段所起　的功能。　在此有以下几点要说明：　（１）鼠标单击事件驱动代码里一般都是放人链接代码，当　鼠标单击一个星标后，ＪａｖａＳｃｒｉｐｔ将把页面跳转到“ｃａｖａｈｏｍｅ．　ａｓｐｘ”页面。　（２）除了“ｃｈｃｋ”事件以外，自然还有其他的事件可以获　取比如双击事件，鼠标移动上事件等，这些都是可以获取的到　的。通过这些事件自然可以实现一些实用的功能。　（３）如果对星标点的小红球图像感觉不满意的话，也可以　根据其ＪａｖａＳｃｒｉｐｔ　ＡＰＩ接口更换其图片。将小红球换成自己想　要的图标，代码为在ｖａｒ　ｍａｒｋｅｒ＝ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．Ｍａｒｋｅｒ后加　人以下代码：　ｉｃｏｎ：　ｉｍａｇｅｓ／ｍａｒｋｅｒ／ｍａｒｋｅｒ．ｐｎｇ　，　其效果如图９所示，将其换为棕的星标图片。　图９　４．３给地图加入区域标记　为了能够在地图上明显地标记出一片区域并能对此区域进　行交互就需要Ｇｏｏｇｌｅ　Ｍａｐ　ＡＰＩ里面的“ｐｏｌｙｇｏｎ”对象．　“ｐｏｌｙｇｏｎ”对象可以在地图指定的区域画出多边形区域，并且　可以设置区域上的文字标记，点击事件等。　要实现在地图上显示多边形区域只要在添加星标的代码后　加入以下代码：　ｖａｒ　ｃｏｕｎｔｙ：　ｖａｒ　ｆｉｐｓＣｏｏｒｄｓ；　ｉｆｐｓＣｏｏｒｄｓ＝【／／定义多边形各个定点坐标　ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７７１８１４４１５５０００３，一　９５．３２８７５３９５９７４１　２２）　ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ（２９．７６０１９１４４７８０９４５．一　９５．３５０３８３２９３２３７３１）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７４５１　３９１　９１　５１　０４８２，一　９５．３６３６０１　２１　９２６２７）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７４１　９３４７０６５６２１　２６，一　９５．３６３８５８７１　１　３２８１　３）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７３９７７３４８４４７３７４４，一　９５．３６１　８８４６Ｏ５４９３１　７）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７３８８７９１　７２０５４６７７，一　９５．３５８８８０５３１　３９６５）　，ｎｅｗ　ｇｏｏｇｌｅ　ｍａｐｓ．ＬａｔＬｎｇ　（２９．７４０６６７７８８９１　７９１，一　、９５．３５５５３３１　３４５４５９１）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ。ＬａｔＬｎｇ　（２９．７３５５９９９５８２９Ｏ９６，一　９５．３４７８Ｏ８３７２５８３Ｏ２）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７５４９７５５７５３２１６１６，一　９５．３３５１　Ｏ５４３０６８８４８）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　《２９．７６１　６８１　６４７２２９０２，一　９５．３２７３８Ｏ６６８７２５６）　，ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（２９．７６７４９３２１　３１　９７２０２，一　９５．３２７８９５６５２８５６４５）　】：　ｃｏｕｎｔｙ＝ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．Ｐｏｔｌｙｇｏｎ（（　ｐａｔｈｓ：ｆｉｐｓＣｏｏｒｄｓ，　ｓｔｒｏｋｅＣｏｌｏｒ：　＃００６７７８　，／／设置多边形边界线区域颜　ｓｔｒｏｋｅＯｐａｃｉｔｙ：０．８．／／设－置多边形边界不透明度　ｓｔｒｏｋｅＷｅｉｇｈｔ：２，／／设置多边形边界线粗度　ｉｆｌｌＣｏｔｏｒ：　＇＃００６７７８　／／设置多边：彩填充颜　￣ｌＯｐａｃｉｙｔ：０．３５／／设置多边形内部透明度　））　ｃｏｕｎｔｙ．ｓｅｔＭａｐ（ｍａｐ）；　ｇｏｏｇｌｅ．ｍａｐｓ．ｅｖｅｎｔ．ａｄｄＬｉｓｔｅｎｅｒ（ｃｏｕｎｔＶ，‘＇ｃｌｉｃｋ　，／／设置多边形　／／区域上的单击事件　ｆｕｎｃｔｉｏｎ（ｅｖｅ九ｔ）｛　ｌｏｃａｔｉｏｎ．ｈｒｅｆ＝　ＦｉｎｄＡＨｏｍｅ．ａｓｐｘ？ｉｄｃｉａ＝ｌ　０１＆ｉｄａｒｅａ＝１　０　：　））：　ｖａｒ　ｍａｐＬａｂｅｌ：ｎｅｗ　ＭａｐＬａｂｅｌ（｛　ｔｅｘｔ：　Ｄｏｗｎｔｏｗｎ　，∥设置多边形区域提示文本　ｐｏｓｉｔｉｏｎ：ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ（２９．７５３８６５８３３４２１　８．一　９５．３４６０５１　３６７９０１　３／／提示文本位置　），　ｍａｐ：ｍａｐ，　ｆｏｎｔＳｉｚｅ：３０，∥设置文字大小　ａｌｉｇｎ：　ｃｅｎｔｅｒ　／／：史字对齐方式　））：　ｍａｐＬａｂｅ１．ｓｅｔ　《　ｐｏｓｉｔｉｏｎ　，　ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　｛２９＿７５３８６５８３３４２１８，一９５．３４６０５１３６７９０１３　））：　代码开头首先定义了一个“ｆｉｐｓＣｏｏｒｄｓ”数组。此数组保存　了多边形各个定点的地理位置坐标值。其中每个坐标有一个　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ对象。　之后定义ｇｏｏｇｌｅ．ｍａｐｓ．Ｐｏｌｙｇｏｎ对象，这正是构建多边形的　翩　脑蠊　

…………………………　……　………………………　实用第一　智慧密集　…　…　…　…　…　…　…　“ｐｏｌｙｇｏｎ”对象．此对象初始化时就要设定好多边形边界线　区域颜、不透明度、边界线粗度、内部透明度、填充颜　。之后用此对象的．ｓｅｔＭａｐ（ｍａｐ）方法将此多边形应用到地　图中去。　为了在多边形上显示提示性的文本，在代码中又定义了　“ＭａｐＬａｂｅｌ”对象。此对象初始化时要求给予文本位置、字体　大小、对齐方式、文字内容等参数。之后用此对象的ｍａｐ：ｍａｐ　参数将此文本对象应用于地图上。　细心的读者又会发现ｇｏｏｇｔｅ．ｍａｐｓ．ｅｖｅｎｔ．ａｄｄＬｉｓｔｅｎｅｒ方法，　不错此方法正是该多边形的单击事件响应方法，当鼠标在多边　形上单击时就会触发此方法，从而去执行跳转代码“ｌｏｃａｔｉｏｎ．　ｈｒｅｆ＝＂ＦｉｎｄＡＨｏｍｅ．ａｓｐｘ？ｉｄｃｉａ＝１０１＆ｉｄａｒｅａ＝１０　；”。　４．４可编辑多边形区域　在地图应用中除了能从网站后台初始化多边形区域外，　Ｇｏｏｇｌｅ　Ｍａｐ　ＡＰＩ还提供了让用户在浏览器端编辑多边形的区域　的功能．并且编辑完成的多边形区域数据可以通过Ｊａｖａｓｃｉｆｐｔ　提取出来并反馈给后台处理。　第一步，应当引入Ｇｏｏｇｌｅ　ｍａｐ　ａｐｉ的响应借１３和ｊｑｕｅｒｙ基　础包。代码如下：　＜ｓｃｒｉｐｔ　ｔｙｐｅ＝　ｔｅｘｔ／ｊａｖａｓｃｒｉｐｔ　ｓｒｃ＝　ｈｔｔｐ：／／ｍａｐｓ。ｇｏｏｇｌｅ．ｃｏｍ／　ｍａｐｓ／ａｐｉ／ｊｓ？ｓｅｎｓｏｒ＝ｔｒｕｅ　＞＜，ｓｃｒｉｐｔ＞　＜ｓｃｒ　Ｆｐｔ　ｓｒｃ＝＇ｊｓ／ｊｑｕｅｒｙ－１．７．２．ｍｉｎ．ｊｓ　ｔｙｐｅ＝＂ｔｅｘｔ／ｊａｖａｓｃｒｉｐｔ　＞＜　｜ｓｃｒｉｐｔ＞　＜ｓｃｒｉｐｔ　ｓｒｃ＝＇ｊｓ／ｐｏｌｙｇｏｎ．ｍｉｎ．ｊｓ　ｔｙｐｅ＝　ｔｅｘｔ／ｊａｖａｓｃｒｉｐｔ　＞＜／　ｓｃｒｉｐｔ＞　第二步，引入以上这些基础包后就可以调用Ｇｏｏｇｌｅ　Ｍａｐ　ＡＰＩ接口了．首先要在＜ｂｏｄｙ＞＜／ｂｏｄｙ＞标记中加入地图框体代　码：＜ｄｉｖ　ｉｄ＝＇ｍａｐ＿ｃａｎｖａｓ　ｓｔｙｌｅ＝＇ｗｉｄｔｈ：６４０ｐｘ；ｈｅｉｇｈｔ：４８０ｐｘ；　＞＜／　ｄｉｖ＞。此代码定义了地图在网页中显示的位置大小。　第三步．用ＪａｖａＳｃｆｉｐｔ调用Ｇｏｏｇｌｅ　Ｍａｐ　ＡＰＩ的接口，初始　化地图。代码如下：　＜ｓｃｒｉｐｔ　ｔｙｐｅ＝＇ｔｅｘｔ／ｊａｖａｓｃｒｉｐｔ　＞　￥（ｆｕｎｃｔｉｏｎ０｛／／页面加载时的ｌｏａｄ事件　ｖａｒ　ｌａｔｌｎｇ　：　ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．ＬａｔＬｎｇ　（　２９．７５１　０２６２３４１　５０９５２　一９５．４０９１　７７３１　４８４３７６）：／／定义地图默认　，／显示的地理位置　ｖａｒ　ｍｙＯｐｔｉｏｎｓ：｛　ｚｏｏｍ：１１．／／定义缩放值　ｃｅｎｔｅｒ：ｌａｔｌｎｇ。　ｍａｐＴｙｐｅｌｄ：ｇｏｏｇｌｅ．ｍａｐｓ．ＭａｐＴｙｐｅｌｄ．ＲＯＡＤＭＡＰ）：　ｖａｒ　ｍａｐ　＝　ｎｅｗ　ｇｏｏｇｌｅ．ｍａｐｓ．Ｍａｐ（ｄｏｃｕｍｅｎｔ．　ｇｅｔＥｌｅｍｅｎｔＢｙｌｄ（　ｍａｐ＿ｃａｎｖａｓ　）．ｍｙＯｐｔｉｏｒｌｓ）：／／｛殳置地图所在　｜｜钓ｄｉｖ　））：　＜／ｓｃｒｉｐｔ＞　通过以上代码就可以在网页上绘制多边形区域了，如图　１Ｏ、图１ｌ所示。　与蘸　嗡　嗨　蛳　蝻薅　；　＿　图１０　图１１　以上代码只实现了绘制多边形的功佳，那怎样提取绘制多　边形后生成的地图数据呢？下面通过以下方式获取所生成的数　据：　第一步，在＜ｂｏｄｙ＞＜／ｂｏｄｙ＞标签内添加按钮和ｄｉｖ的ｈｔｍｌ　代码：　＜ｉｎｐｕｔ　ｉｄ：　ｒｅｓｅｔ　ｖａｌｕｅ＝　Ｒｅｓｅｔ　ｔｙｐｅ＝＝＂ｂｕｔｔｏｎ　／＞　＜ｉｎｐｕｔ　ｉｄ＝　ＳｈｏｗＤａｔａ　ｖａｌｕｅ＝　Ｓｈｏｗ　Ｐａｔｈｓ　ｔｙｐｅ＝　ｂｕｔｔｏｎ　，＞　＜ｄｉｖ　ｉｄ＝　ｄａｔａＰａｎｅｌ　＞＜／ｄｉｖ＞。　＜ｄｉｖ　ｉｄ＝　ｄａｔａＰａｎｅ２　ｌ＞　在此定义了一个输出数据按钮和一个重置按钮。　第二步，在ｊａｖａｓｃｒｉｐｔ调用Ｇｏｏｇｌｅ　ｍａｐ印ｉ的代码后加入以　下代码：　ｖａｒ　ｃｒｅａｔｏｒ＝ｎｅｗ　ＰｏｌｙｇｏｎＣｒｅａｔｏｒ（ｍａ　ｐ）；　￥《　＃ｒｅｓｅｔ　）．ｃｌｉｃｋ（ｆｕｎｃｔｉｏｎＯ｛　￥《　＃ｄａｔａＰａｎｅｌ＇）．ｅｍｐｔｙ０；　ｃｒｅａｔｏｒ．ｄｅｓｔｒｏｙ０；　ｃｒｅａｔｏｒ＝ｎｕｌｌ；　ｃｒｅａｔｏｒ＝ｎｅｗ　ＰｏｌｙｇｏｎＣｒｅａｔｏｒ（ｍａｐ）；　））：　￥（　＃ｓｈｏｗＤａｔａ，）．ｃｌｉｃｋ（ｆｕｎｃｔｉｏｎＯ｛∥显示数据按钮事件　￥（　＃ｄａｔａＰａｎｅｌ，）＿ｅｍｐｔｙ（）：　￥《　＃ｄａｔａＰａｎｅ２　）．ｅｍｐｔｙ（）；　ｉｆ（ｎｕｌｌ＝＝ｃｒｅａｔｏｔ．ｓｈｏｗＤａｔａ０）｛　￥（　＃ｄａｔａＰａｎｅｌ，）＿ａｐｐｅｎｄ（　Ｐｌｅａｓｅ　ｆｉｒｓ１　ｃｒｅａｔｅ　ａ　ｐｏｌｙｇｏｎ　｝ｅｌｓｅ｛　￥（　＃ｄａｔａＰａｎｅ２，）．ａｐｐｅｎｄ（ｍａｐ．ｇｅｔＺｏｏｍ０）；　￥（　＃ｄａｔａＰａｎｅｌ＇）．ａｐｐｅｎｄ（ｃｒｅａｔｏｒ．ｓｈＯ、＾’Ｄａｔａ｛））：　）））：　￥（　＃ｓｈｏｗＣｏｌｏｒ＇）　ｃｌｉｃｋ（ｆｕｎｃｔｉｏｎ０｛／／显示颅按钮事件　￥（　＃ｄａｔａＰａｎｅｌ　）．ｅｍｐｔｙ（）：　ｉｆ（ｎｕｌｌ＝＝ｃｒｅａｔｏｒ．ｓｈｏｗＤａｔａ０）｛　￥（＇＃ｄａｔａＰａｎｅｌ　ｒ）．ａｐｐｅｎｄ（　Ｐｌｅａｓｅ　ｆｉｒｓｔ　ｃｒｅａｔｅ　ａ　ｐｏｌｙｇｏｎ　）：　｝ｅｌｓｅ｛　￥｛　＃ｄａｔａＰａｎｅｌ　）．ａｐｐｅｎｄ（ｃｒｅａｔＯｒ．ｓｈｏ￣＾　Ｃｏｌｏｒ（））；　｝　｝）　这样就写完了所有的关于编辑地图并显示相应数据的代码　了，然后试一下效果。　（下转第９０页）　

………　………　…………………　…　……………　实用第一　智慧密集　…　目名的不同进行不同的处理。是整个监控程序的实现核心。实　现的函数如下：　ｂｒｅａｋ；　ｃａｓｅ　４：ｃａｓｅ　５：ｃａｓｅ　６：ｃａｓｅ　７：　ＨＤＤＥＤ　ｒＡ　ＣＡＬＬＢＡＣＫ　ＤｄｅＣａｌｌｂａｃｋ（／／回调函数　ｆＴｕｍｏｕｔ［１］［ｉ－・　￣］＝ａｔｏｆ（ｔｍｐ）；　ｂｒｅａｋ；　ＵＩＮＴ　ｕＴｙｐｅ，　／／传输类型　ＵＩＮＴ　ｕＦｍｔ，　∥剪切板数据格式　ＨＣＯＮＶ　ｈＣｏｎｖ，　／／会话旬柄　ＨＳＺ　ｈＴｏｐｉｃ，　／／主题字符串句柄　ＨＳＺ　ｈｌｔｅｍ．　／／项目名字符串句柄　ＨＤＤＥＤ　ｒＡ　ｈＤａｔａ．／／全局内存对象句柄　ＤＷＯＲＤ　ｄｗＤａｔａ１，／／指定的传输数据　ＤＷＯＲＤ　ｄｗＤａｔａ２）／／指定的传输数据　｛　ｉｎｔ　ｉ：　）　）　）　ｒｅｔｕｒｎ《ＨＤＤＥＤＡＴＡ）ＤＤＥ—ＦＡＣＫ；＃回执　）　ｒｅｔｕｒｎ　０：　）　（６）ＤＤＥ退出。包括注销服务，注硝初始化和释放程序　名（Ａｐｐｌｉｃａｔｉｏｎ）、主题名（Ｔｏｐｉｃ）和项Ｅ『名（Ｉｔｅｍ）。　ｃｈａｒ　ｔｍｐ［２５５］；　ＣＳｔｒｉｎｇ　ｓｔｒ；　６　结语　采用Ｗｉｎｄｏｗｓ　ＤＤＥＭＬ实现ＬｏｎＷｍｋｓ网络监控程序，原　理清晰简单，开发周期短，上手容易，效率高，能满足监控程　序的通信要求。　ｓｗｉｔｃｈ（ｕＴｙｐｅ）　｛　ｃａｓｅ　Ｘ－Ｐ（Ｐ．＿ＡＤＶＳＴＡＲＴ：　ｃａｓｅ　ＸＴＹＰＣＯＮＮＥＣＴ：／／连接请求　＿ｒｅｔｕｒｎ（ＨＤＤＥＤＡＴＡ）ＴＲＵＥ；　ｃａｓｅ　ＸＴＹＰＡＤＶＤＡＴＡ：∥有数据到来　—ｆｏｒ（＝Ｏ；ｉ＜ＤＤＥ—ＩＴＥＭ—ＮＵＭＳ：ｉ＋＋）　｛　参考文献　［１】高安邦，等．ＬｏｎＷｏｒｋｓ技术开发和应用．北京：机械工业　出版社，２００９．　ｉｆ（ｈｌｔｅｍ＝＝ｈｓｚｌｔｅｍ［ｉ］）　角定数据项　｛　［２】高安邦，杨帅，陈俊生．ＬｏｎＷｏｒｋｓ技术原理与应用．北　京：机械工业出版社，２００９．　ＤｄｅＧｅｔＤａｔａ（ｈＤａｔａ，（ＰＢＹＴＥ）ｔｍｐ，２５５，０）：脓得数据　ｓｗｉｔｃｈ（ｉ）　｛　ｃａｓｅ　０：ｃａｓｅ　１：ｃａｓｅ　２：ｃａｓｅ　３：　『３】周江．利用ＶＣ实现ＤＤＥ服务客户』由用．电脑编程技巧与　维护，２００３，２．　ｆＴｕｒｎｏｕｔ［０］［ｉ］＝ａｔｏｆ（ｔｒｒＩｐ）：　石　、　石　Ｉ＿石　石　＼！　＼！　＼！　（收稿日期：２０１２—１０—２４）　＼！　石　分　（上接第７０页）　首先在地图内画一个多边形区域，如图１２所示。　５　结｛吾　Ｇｏｏｇｌｅ　ＭＡＰ　ＡＰＩ所提供的接口，丰　喜’了普通网站页面的内　容．为网站提供了免费的地理图形显示功能，在此基础上又提　供了多种地图应用，方便了用户和网站的交互。　通过ＧｏｏｇｌｅＭａｐｓ为开发者提供的地图ＡＰＩ，可以开发出　各种各样有趣的地图Ｍａｓｈ—ｕｐ应用，还可以将不同地图图层　加载到应用中，如卫星影像、根据海拔高度绘制的高山和植　被地形图、街道视图等，从而帮助开发者打造个性化的地图　图１２　应用站点。　然后分别点击“ｓｈｏｗ　ｄａｔａ”、　“ｓｈｏｗ　ｃｏｌｏｒ”按钮，效果如　地图ＡＰＩ是一项免费的服务，任何非盈利性网站均可使用。　图１３所示。数据和颜分别都显示出来了。　｜　赫　酶ｌ　氟　蝻　氟　６０ｔ　－｛　４一　…７０　¨０　∞　０　｛　Ｊ　２ｇ　７｛０　９５ｌ５３∞０　：．－％０　；９　？　，｛　｛２　６｛　协，ｌ２９．ｅ０＊　５３Ｂ　¨　９５．　ｌ０　７∞“５３２＿ｃ掘８ｊ｝　∞∞时６　ｌｌ　－　｛　带　５５５７　０｛　｛　５，０　０　Ｂ７时０　？５∞＃　参考文献　【１］（Ｏｏｏ￣ｅ　ｍａｐ　ａｐｉ　ｖ３》．Ｈｔｔｐ：／／ｄｅｖｅｌｏｐ￣Ｉｒ．ｇｏｏｇｌｅ．ｃｏｒｎ／．　【２］（Ｇｏｏｇｌｅ　ｍａｐ　ａｐｉ））．Ｈｔｔｐ：／／ｗｗｗ．ｇｏｏｇｌｅ．ｃｏｍ／ａｐｉｓ／ｍａｐｓ／　（收稿日期：２０１２—０９—０５）　蘸　蜡　Ｏ∞０　ｉｌ　蕊　图１３　器与