使用jquery在Google地图中显示多个标记

时间:2013-08-15 02:59:37

标签: php jquery ajax google-maps google-maps-markers

选择区域后,我正尝试在地图中显示多个标记。我得到正确的坐标但我无法显示标记。我不知道我的代码中缺少什么或出了什么问题。任何帮助将不胜感激。

这是我的剧本:

var region;
var map;

function getPoints(id){
    var str = $.ajax({                                      
        url: 'getPoints.php/'+id,
        async: false,
        data: {"id":id},
        dataType: "json",
        type: 'POST',
    }).responseText;
    return str;
}

  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(15.583333,121.966667),
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
  }

  function setMarkers(map, points){
        for (var i=0; i<points.length; i++) {
            //console.log("lat= " + points[i].lat + " ,lon= " + points[i].lon);
            var latlngset;
            latlngset = new google.maps.LatLng(points[i].lat, points[i].lon);
            console.log(latlngset);
            var marker = new google.maps.Marker({  
                map: map, 
                position: latlngset  
            });

        }
    }

  google.maps.event.addDomListener(window, 'load', initialize);

  $(document).ready(function(){

    $("#region").change(function(){
        region = $("#region").val();
            $.ajax({
            type:"post", 
            url:"getDivision.php", 
            data:"region="+region, 
            success: function(data) {
                $("#division").html(data);
            }
        });
    });

    $('form[name="thisform"]').submit(function(event){
        var points = getPoints(region);
        points = JSON.parse(points);
        setMarkers(map, points);
    });
});

这是HTML部分

<form name="thisform">
    <select name="region" id="region">
        <option>--Select Region--</option>
        <?php
            $query = "SELECT * FROM region " ;
            $result = mysql_query($query) or die(mysql_error());

            while($row = mysql_fetch_array($result)){
                echo "<option value='".$row['region_id']."'> ".$row['region_name']." </option> ";
            }
        ?>
    </select>

    <input type="submit" name="submit" value="OK">
</form>
<div id="map-canvas"><br><br>

我得到这个JSON

[Object { lat="10.6733", lon="122.993"}, 
Object { lat="10.6941", lon="122.319"}, 
Object { lat="11.1555", lon="122.502"}]

0 个答案:

没有答案