0

我使用 jquery 在我的 asp.net 页面上显示谷歌地图。我有国家名称、公司名称、地址和经度和纬度。

现在我已经在下拉列表中添加了所有地址，基于下拉选择我已经在代码中传递了经度和纬度。这部分正在工作，因为它根据纬度和经度显示地图。但是我没有经度和纬度一些公司。所以我想直接使用公司的地址来显示地图。

这是我使用的代码：

  <script src="js/jquery/jquery-1.9.0.min.js"></script>
    <!-- <msdropdown> -->
    <link rel="stylesheet" type="text/css" href="css/msdropdown/dd.css" />
    <script src="js/msdropdown/jquery.dd.js"></script>



    <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />


    <script type="text/javascript"
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false">
    </script>


    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places">
    </script>
    </head>
    <body onload="initialize()">
    <select  id="countries" style="width:300px;" onchange="updateMap(this.options[this.selectedIndex].value)">
          <option value='TVSH - Rruga Ismail Quemali 11>TVSH - Rruga Ismail Quemali 11, Tirana</option></select>


  function updateMap(selectControl) {
            alert(selectControl);
            switch (selectControl) {
                case 'TVSH - Rruga Ismail Quemali 11, Tirana':
                    var polyline = new google.maps.Polyline({
                        path: [

  new google.maps.LatLng(41.321102, 19.823112)],
                        strokeColor: "#FF0000",
                        strokeOpacity: 1.0,
                        strokeWeight: 2
                    });

                    var latLng = new google.maps.LatLng(41.321102, 19.823112)
                    break;

                default:
                    break;
            }
            initialize(polyline, latLng);
        }

        function initialize(polyline, schoolLatLng) {
            var myLatLng = schoolLatLng;
            var myOptions = {
                zoom: 13,
                center: myLatLng,
                mapTypeId: google.maps.MapTypeId.TERRAIN
            };


            var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

            polyline.setMap(map);

        }

现在地图是根据纬度和经度显示的。有什么办法可以直接在基础地址上显示地图。我有所有公司的地址，例如：EURONEWS - 60, chemin des Mouilles - 69130 Lyon-Écully, France

我可以在这个地址的基础上显示地图吗？如果需要，请向我询问更多描述。

4

3 回答 3

0

您可以使用Geocoding API，API 的目的正是将地址转换为坐标，然后使用此坐标您可以渲染地图，就像您已经做过的那样。

例子：

var geocoder = new google.maps.Geocoder();
//convert location into longitude and latitude
geocoder.geocode({
    address: 'chemin des Mouilles - 69130 Lyon-Écully, France'
}, function(locResult) {
    var lat1 = locResult[0].geometry.location.lat();
    var lng1 = locResult[0].geometry.location.lng();
});
于 2013-08-10T15:13:00.250 回答
0

您可以执行以下操作：

var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': 'chemin des Mouilles - 69130 Lyon-Écully, France'}, 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
    });
  } else {
    alert("Geocode was not successful for the following reason: " + status);
  }
});

但要小心，因为地理编码器是异步的。

https://developers.google.com/maps/documentation/javascript/geocoding

于 2013-08-10T15:22:40.307 回答
0

或者您可以检查这 2 项服务以寻找替代方案。我有大部分数据打印出来，他们发回给你，只需点击“查找我”按钮。但是请拉起您的控制台以查看所有内容。

Codepen.io 示例

于 2013-08-10T15:29:02.217 回答