注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

xiaozhuge0825的博客

 
 
 

日志

 
 

Google 地图API实例  

2009-09-16 09:01:18|  分类: php |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">

<head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Google 地图 JavaScript API 示例: 定制图标</title>

    <script src="http://ditu.google.cn/maps?file=api&amp;v=2&amp;key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA&hl=zh-CN"

            type="text/javascript"></script>

<style type=text/css>

ul{

float:left;

}

</style>

    <script type="text/javascript">

    var map = null;

    var geocoder = null;

    function initialize() {

      if (GBrowserIsCompatible()) {

        map = new GMap2(document.getElementById("map_canvas"));

        map.setCenter(new GLatLng(39.917439,116.397228), 8);

   var mapControl = new GMapTypeControl();

  

   map.addControl(new GLargeMapControl());

        geocoder = new GClientGeocoder();

   showAddress("北京",'已加盟网址',8);

      }

    }

    function showAddress(address,html,level) {

      if (geocoder) {

        geocoder.getLatLng(

          address,

          function(point) {

            if (!point) {

              alert("不能解析: " + address);

            } else {

              map.setCenter(point, level);

              var marker = new GMarker(point);

     map.clearOverlays() ;

              map.addOverlay(marker);

              marker.openInfoWindowHtml(html);

      GEvent.addListener(marker, "click", function() {

      marker.openInfoWindowHtml(html);

     });

            }

          }

        );

      }

    }

    </script>

</head>

<body onload="initialize()" onunload="GUnload()">

    <div id="map_canvas" style="width: 600px; height: 300px"></div>

<div>

<ul>

   <li><a href="javascript:void(0)" onclick="showAddress('上海','http://12313213213',8);">上海</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('天津','申请加盟',8);">天津</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('重庆','申请加盟',8);">重庆</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('广州','申请加盟',8);">广州</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('武汉','申请加盟',8);">武汉</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('太原','申请加盟',8);">太原</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('石家庄','申请加盟',8);">石家庄</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('长沙','申请加盟',8);">长沙</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('济南','申请加盟',8);">济南</a></li>

  

</ul>

<ul>

   <li><a href="javascript:void(0)" onclick="showAddress('广东','申请加盟',6);">广东</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('广西','申请加盟',6);">广西</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('贵州','申请加盟',6);">贵州</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('台湾','申请加盟',6);">台湾</a></li>

  

</ul>

<ul>

   <li><a href="javascript:void(0)" onclick="showAddress('阿联酋','申请加盟',3);">阿联酋</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('澳大利亚','澳大利亚能源',3);">澳大利亚</a></li>

  

</ul>

<ul>

   <li><a href="javascript:void(0)" onclick="showAddress('亚洲','亚洲申请加盟',2);">亚洲</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('欧洲','欧洲能源',2);">欧洲</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('非洲','非洲能源',2);">非洲</a></li>

   <li><a href="javascript:void(0)" onclick="showAddress('北美洲','北美洲能源',2);">北美洲</a></li>

  

</ul>

<ul>

   <li><a href="javascript:void(0)" onclick=" map.clearOverlays();map.setCenter(new GLatLng(-0.57128,117.597656), 1);">世界</a></li>

  

  

</ul>

</div>

</body>

</html>

  评论这张
 
阅读(1373)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018