zoukankan      html  css  js  c++  java
  • 看看如何将google地图嵌入到网页中!

    今天下午就干一件事,怎样点击google地图,获取坐标和缩放级别,丢到数据库,下次的时候,通过坐标还有缩放级别,直接显示我点击的那个位置

    不说了,直接放代码了!

    1 //这个是引入google的库
    2 <script src="http://maps.google.com/maps?file=api&amp;v=3&amp;sensor=true&amp;key=ABQIAAAAIHAbNjJQCreFjDptcT4yjBR2jvTZOFQfaCn8QtYrCty2-BDc7RSG6t6loXYOXGxFmfXf9-Le0DVAQA" type="text/javascript"></script>

     

    //接下来我要把地图显示在一个框框里面去,也就是DIV里面

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

    <div id="show_x"></div><!--显示X坐标-->
    <div id="show_y"></div><!--显示Y坐标-->
    <div id="zoom"></div><!--显示缩放级别-->

    //下面将会是实例化google库,开始要干了!

    <script language="javascript">
    var map = new GMap2(document.getElementById("map_canvas"));//实例化,显示google地图
    var center = new GLatLng(39.916912086904624,116.39697074890137); 指定的坐标
    map.setCenter(center,
    13);//指定坐标,缩放级别,setcenter 设置地图中心位置
    //
    var mapControl = new GMapTypeControl();     //控件
    //map.addControl(mapControl);            //控件 
    //map.addControl(
    new GLargeMapControl());   //控件
    var marker = new GMarker(center, {draggable: true});//是否可以拖动
    map.addOverlay(marker); //生成了一个小标记 //marker
     
         //下面的部分是什么呢?
    GEvent.addListener(map,
    'click', function(overlay, point) {
    if (point) {
    document.getElementById(
    "show_x").innerHTML = point.x; //获取当前是x的坐标
    document.getElementById("show_y").innerHTML = point.y; //获取当前是y坐标
    document.getElementById("zoom").innerHTML = map.getZoom(); //获取当前是缩放级别
    }
    });
    </script>
    //完事了!,看google的api document要少活2000年,要是熬过去了,可以多活20000年!

      

      

     

  • 相关阅读:
    转换流与标准的输入输出流
    缓冲流
    节点流(文件流) FileInputStream & FileOutputStream & FileReader & FileWriter
    IO流概述
    File类的使用
    枚举&注解
    泛型的使用
    Collections工具类
    Map接口之HashMap,LinkedHashMap,TreeMap
    MySQL 高可用之MHA
  • 原文地址:https://www.cnblogs.com/wangzong/p/2117458.html
Copyright © 2011-2022 走看看