javascript – 谷歌地图

我很难找到有关如何在谷歌地图中实现此效果的最新相关信息.我希望有人在这个问题上比我更了解,并指出我正确的方向..

问题：

>我需要通过邮政编码在地图上绘制X量的针脚.
>第二步是输入我自己的邮政编码并生成第一步中绘制的最接近的5个邮政编码的列表.

解决方法

此代码将告诉您最接近您在框中输入的邮政编码.我相信你可以从这里调整它以获得前5名的成绩.

<!DOCTYPE html>
<html>
<head>
<Meta name="viewport" content="initial-scale=1.0,user-scalable=no"/>
<Meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Geocoding Simple</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/standard.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var geocoder;
    var map;
    var markers = [];
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(40.768505,-111.853244);
        var myOptions = {
            zoom: 8,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
        addPostCode('84101');
        addPostCode('84102');
        addPostCode('84103');
        addPostCode('84104');
        addPostCode('84105');
    }

    function addPostCode(zip) {
        geocoder.geocode( { 'address': zip},function(results,status) {
        if (status == google.maps.GeocoderStatus.OK)
        {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
            map: map,position: results[0].geometry.location,name: zip
        });
        markers.push(marker);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
        });
    }

    function checkZip(zip)
    {
        var distance = Number.MAX_VALUE;
        var index = 0;
        geocoder.geocode( { 'address': zip},status)
        {
            if (status == google.maps.GeocoderStatus.OK)
            {
                for(ix=0; ix< markers.length; ix++)
                {
                    var tmp = getDistance(results[0].geometry.location,markers[ix].position);
                    if (tmp < distance)
                    {
                        distance = tmp;
                        index = ix;
                    }
                }
                alert('nearest zipcode is :' + markers[index].name);
            }
        });
    }

    function getDistance(latlng1,latlng2)
    {
        var R = 6371; // Radius of the earth in km
        var dLat = (latlng2.lat()-latlng1.lat()) * Math.PI / 180;  // Javascript functions in radians
        var dLon = (latlng2.lng()-latlng1.lng()) * Math.PI / 180;
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
            Math.cos(latlng1.lat()  * Math.PI / 180) * Math.cos(latlng2.lat()  * Math.PI / 180) *
            Math.sin(dLon/2) * Math.sin(dLon/2);
        var c = 2 * Math.atan2(Math.sqrt(a),Math.sqrt(1-a));
        var d = R * c; // Distance in km
        d = d * 0.621371192; // convert to miles
        return d;
    }
</script>
</head>
<body onload="initialize()">
  <div>
    <input id="address" type="textBox" value="">
    <input type="button" value="Geocode" onclick="checkZip(getElementById('address').value)">
  </div>
<div id="map_canvas" style="height:90%"></div>
</body>
</html>

javascript – 谷歌地图 – 邮政编码

解决方法

猜你在找的JavaScript相关文章