地域を選択したら、マップに複数のマーカーを表示しようとしています。正しい座標を取得していますが、マーカーを表示できません。コードに何が欠けているのか、何が間違っているのかわかりません。どんな助けでも大歓迎です。
これが私のスクリプトです:
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"}]