drllqg2903
2012-06-04 14:57
浏览 54
已采纳

反向地理编码在Google Maps api v3上

I wonder whether someone may be able to help me please.

I using the code shown below to correctly plot markers retrieved from a MySQL database on a Google Map.

<script type="text/javascript">
             //Sample code written by August Li
             var icon = new google.maps.MarkerImage("images/location-marker-2.png")
             new google.maps.Point(16, 32);
             var center = null;
             var map = null;
             var bounds = new google.maps.LatLngBounds();
             function addMarker(lat, lng, info) {
             var pt = new google.maps.LatLng(lat, lng);
             bounds.extend(pt);
             var marker = new google.maps.Marker({
             position: pt,
             icon: icon,
             map: map
             });
             }
             function initMap() {
             map = new google.maps.Map(document.getElementById("gmaps-canvas"), {
             center: new google.maps.LatLng(0, 0),
             zoom: 6,
             scrollwheel: true,     
             draggable: true, 
             mapTypeId: google.maps.MapTypeId.SATELLITE
             });
                <?php

                        include("admin/link.php");
                        include("admin/opendb.php");

                        $query = mysql_query("SELECT * FROM `detectinglocations` WHERE `locationid` = '$lid'");
                        while ($row = mysql_fetch_array($query)){
                            $locationname=$row['locationname'];
                            $osgb36lat=$row['osgb36lat'];
                            $osgb36lon=$row['osgb36lon'];
                            echo ("addMarker($osgb36lat, $osgb36lon,'<b>$locationname</b><br/>');
");
                        }
                             mysql_close($connect);
                 ?>

                         center = bounds.getCenter();
                         map.fitBounds(bounds);
                        }
</script> 

What I'm now trying to do is add further functionality that allows users to also click on the map to plot new markers, in essence using the pre-existing marker from the database as a point to work from, performing a reverse geocode.

I've been researching this for a number of days now and I've tried to implement a whole host of tutorials, but I just can't seem to get both parts of the functionality working.

I do know that to enable a on-click event I need to incorporate something along the lines of:

google.maps.event.addListener(map, 'click', function(event) { marker.setPosition(event.latLng) geocode_lookup( 'latLng', event.latLng ); }); }

but I must admit I'm a little unsure about what else I need to incorporate.

I just wondered whether someone may be able to take a look at this please, and I'd be very grateful if someone could show me where I've gone wrong.

Many thanks and kind regards

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • doushan1850 2012-06-04 15:43
    已采纳

    I wrote a separate maps page with just click-to-reverse-geocode functionality

    http://jsfiddle.net/ZDQeM/

    The address details are confusing to work with, I think. The results are an array, at different levels of precision, one might include the county, another the state, another the street address. Generally I only use results[0]. The details are in the docs: https://developers.google.com/maps/documentation/javascript/geocoding#GeocodingResponses

    If you need specific information the sure way to obtain it is iterate through the whole results array until you find what you need (types[] containing postal_code, for example).

        google.maps.event.addListener(map, 'click', function(event) {
          userMarker = new google.maps.Marker({
            map: map,
            position: event.latLng
          });
    
          geocoder.geocode({'latLng': event.latLng}, function(results, status) {
            if(status == google.maps.GeocoderStatus.OK) {
              if (results[0]) {
                alert(results[0].formatted_address);
              }
              else {
                alert("No results");
              }
            }
            else {
              alert("Geocoding unsuccessful: Status " + status);
            }
          });
        });
    

    Where in your code?

    <script type="text/javascript">
             //Sample code written by August Li
             var icon = new google.maps.MarkerImage("images/location-marker-2.png")
             new google.maps.Point(16, 32);
             var center = null;
             var map = null;
             var bounds = new google.maps.LatLngBounds();
             function addMarker(lat, lng, info) {
             var pt = new google.maps.LatLng(lat, lng);
             bounds.extend(pt);
             var marker = new google.maps.Marker({
             position: pt,
             icon: icon,
             map: map
             });
             }
             function initMap() {
             map = new google.maps.Map(document.getElementById("gmaps-canvas"), {
             center: new google.maps.LatLng(0, 0),
             zoom: 6,
             scrollwheel: true,     
             draggable: true, 
             mapTypeId: google.maps.MapTypeId.SATELLITE
             });
                <?php
    
                        include("admin/link.php");
                        include("admin/opendb.php");
    
                        $query = mysql_query("SELECT * FROM `detectinglocations` WHERE `locationid` = '$lid'");
                        while ($row = mysql_fetch_array($query)){
                            $locationname=$row['locationname'];
                            $osgb36lat=$row['osgb36lat'];
                            $osgb36lon=$row['osgb36lon'];
                            echo ("addMarker($osgb36lat, $osgb36lon,'<b>$locationname</b><br/>');
    ");
                        }
                             mysql_close($connect);
                 ?>
    
                         center = bounds.getCenter();
                         map.fitBounds(bounds);
    
                         var geocoder = new google.maps.Geocoder();
    
                         google.maps.event.addListener(map, 'click', function(event) {
                           var userMarker = new google.maps.Marker({
                             map: map,
                             position: event.latLng
                           });
    
                         geocoder.geocode({'latLng': event.latLng}, function(results, status) {
                           if(status == google.maps.GeocoderStatus.OK) {
                             if (results[0]) {
                               alert(results[0].formatted_address);
                             }
                             else {
                               alert("No results");
                             }
                           }
                           else {
                             alert("Geocoding unsuccessful: Status " + status);
                           }
                         });
                       });
                     }
    </script> 
    
    已采纳该答案
    打赏 评论

相关推荐 更多相似问题