日期:2014-05-17  浏览次数:20771 次

利用JS获取经纬度,定位html地图
<!--
  copyright (c) 2009 Google inc.
  You are free to copy and use this sample.
  License can be found here: http://code.google.com/apis/ajaxsearch/faq/#license
-->
<!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 Maps API Sample</title>
    <style type="text/css">
      @import url("http://www.google.com/uds/css/gsearch.css");
      @import url("http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css");
    </style>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA1XbMiDxx_BTCY2_FkPh06RRaGTYH6UMl8mADNa0YKuWNNa8VNxQEerTAUcfkyrr6OwBovxn7TDAH5Q"
      type="text/javascript"></script>
    <script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0" type="text/javascript"></script>

    <script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script>
    function initialize() {
      if (GBrowserIsCompatible()) {
        // Create and Center a Map36.1019825, 103.6055232)
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(36.1019825, 103.6055232), 13);
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
    
        // bind a search control to the map, suppress result list
        map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
		
      }
    }
    GSearch.setOnLoadCallback(initialize);

    </script>
  </head>
  <body onload="initialize()" onunload="GUnload()" style="font-family: Arial;border: 0 none;">
    <div id="map_canvas" style="width: 500px; height: 300px"></div>
  </body>
</html>


通过地址获取经纬度
<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8" contentType="text/html;charset=utf-8" %>
<%@ include file="/common/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="/styles/ui_common_style.css" rel="stylesheet" type="text/css" />
<script src="http://ditu.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA_zi7L6cpe4J1WluhuKve0BT1V3LlcAyZs_rJnbX4McegqDYCtBT4TtSQRAm_03EocwOwlLLyaxG2zg" type="text/javascript"></script>
<script type="text/javascript" src="/scripts/jquery.js"></script>
<script src="/scripts/validate.js" type="text/javascript"></script>
<script src="/scripts/ssjl_Registered.js" type="text/javascript"></script>
<script src="/scripts/message.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        var lonNum;
        var latNum;
        $(":input[name=\'submit\']").click(function(){
            if(Detect()){
            var address=document.getElementById('Address').value;
            var geocoder = new GClientGeocoder();
               geocoder.getLatLng(
                address,
                function(point) {
                    var mycars=new Array()
                    mycars = new String(point).split(",");
                    latNum = mycars[0].substring(1);
                    lonNum = mycars[1].substring(1,mycars[1].length-1);
                    var $form = $("#user").serialize();
                        $.ajax({
                            type:"POST",