谷歌地图接口，实现点击标记获取经纬度等信息。

Google map api

Author chenbin
Date 12/12
Email bingoPureLife@gmail.com

标记在地图上的位置 并且获取当前位置的经纬度

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Google Maps Demo</title>
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
    <script src="{vifnn::STATICS}/jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="/tpl/static/artDialog/jquery.artDialog.js?skin=default"></script>
    <script src="/tpl/static/artDialog/plugins/iframeTools.js"></script>
    <script type="text/javascript">
        var infowindow,marker;
        var geocoder = new google.maps.Geocoder();
        function initialize() {
            //var point = new google.maps.LatLng(18.252847, 109.511909);
            var point; // 地图中心
            if(getLatLngFromParent() != ''){
                point = getLatLngFromParent();
                loadMap(point);
            }else{
                if(navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(function(position) {
                        point = new google.maps.LatLng(
                                position.coords.latitude,
                                position.coords.longitude
                        );
                        loadMap(point);
                    });
                } else {
                    // Browser doesn't support Geolocation
                    handleNoGeolocation();
                }
            }
        }
        function loadMap(point){
            var myOptions = {
                zoom: 15, // 缩放级别
                center: point,
                mapTypeId: google.maps.MapTypeId.ROADMAP, // 显示普通的街道地图
                mapTypeControl: false, // 地图类型控件
                overviewMapControl: false, // 总览图控件
                scaleControl: false, // 比例控件
                streetViewControl: false // 街景视图
            };
            var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

            //添加地图标记
            marker = new google.maps.Marker({
                position: point,
                map: map
            });
            marker.setDraggable(true); // 设置可拖拽

            //初始化信息窗口
            infowindow = new google.maps.InfoWindow({
                content: "",
                size: new google.maps.Size(50,50)
            });

            //添加拖动监听事件
            google.maps.event.addListener(marker, 'dragend', function(){
                showAddress(map, marker);
            });
            //添加点击标记监听事件
            google.maps.event.addListener(marker, 'click', function(){
                showAddress(map, marker);
            });
            //添加点击监听事件

            google.maps.event.addListener(map, 'click', function(e) {
                clickMou(map,marker,e.latLng);
            });
            showAddress(map,marker);
        }

        function handleNoGeolocation() {
                //长沙公司地址
                point = new google.maps.LatLng(28.127907999999998, 112.98059999999998);
                loadMap(point);
        }
        function showAddress(map, marker)
        {
            var latlng = marker.getPosition();
            geocoder = new google.maps.Geocoder();

            //根据经纬度获取地址信息
            geocoder.geocode({'latLng': latlng}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    if (results[1]) {
                        var address = results[1].formatted_address + "<br />";
                        address = results[0].formatted_address + "<br />";
                        address += "纬度：" + latlng.lat() + "<br />";
                        address += "经度：" + latlng.lng();

                        infowindow.setContent(address);
                        infowindow.open(map, marker);
                        transfer(latlng.lat(),latlng.lng());
                    }
                } else {
                    alert("Geocoder failed due to: " + status);
                }
            });
        }

        function clickMou(map, marker,location)
        {
            marker.setPosition(location)

            //根据经纬度获取地址信息
            geocoder.geocode({'latLng': location}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    if (results[1]) {
                        var address = results[1].formatted_address + "<br />";
                        address = results[0].formatted_address + "<br />";
                        address += "纬度：" + location.lat() + "<br />";
                        address += "经度：" + location.lng();
                        infowindow.setContent(address);
                        infowindow.open(map, marker);
                        transfer(location.lat(),location.lng());
                    }
                } else {
                    alert("Geocoder failed due to: " + status);
                }
            });

        }

        function transfer(lat,lng){
            var origin = artDialog.open.origin;
            var longitudeinput = origin.document.getElementById('longitude');
            var latitudeinput = origin.document.getElementById('latitude');
            longitudeinput.value = lat;
            latitudeinput.value = lng;
            //art.dialog.close();
        }
        function getLatLngFromParent(){
            if (art.dialog.data('longitude')) {
                point = new google.maps.LatLng(
                    art.dialog.data('longitude'),
                    art.dialog.data('latitude')
                );
                return point;
            };
        }
    </script>
</head>

<body onload="initialize()">
<div id="map_canvas" style=" 600px; height: 400px"></div>
</body>
</html>
积累知识，分享知识，学习知识。