私はGoogle Mapを学び始めています。静的に宣言されたときにマーカーが動作して表示されているのは奇妙ですが、DBから来たときには地図上に描かれていません。Google Map DBからのマーカーが機能しない
// var markers = [[15.054419, 120.664785, 'Device1'], [15.048203, 120.692186, 'Device 2'], [15.033303, 120.694611, 'Device 3']];
var markers = [];
ここにコード全体がありますが、多分何か不足していますか?私もコンソールログを使用して、私は正常にajaxからのすべてのデータをmarkers
変数に渡します。
私はここのどこかでこのコードを手に入れて、自分のDBがレコードを要求するように修正したと思います。私はあなたがこの事を私に助けてくれることを願っています。ありがとうございました!ここでEDIT
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=initialize"></script>
<script type="text/javascript">
var map;
var global_markers = [];
// var markers = [[15.054419, 120.664785, 'Device1'], [15.048203, 120.692186, 'Device 2'], [15.033303, 120.694611, 'Device 3']];
var markers = [];
var infowindow = new google.maps.InfoWindow({});
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(15.058607, 120.660884);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
$.ajax({
type: 'GET',
url: 'control_panel/get_device_list_ajax',
success:
function (data) {
data = JSON.parse(data);
if (data['success']){
var device = data['device_list'];
device.forEach(function (dev) {
markers.push([dev['dev_geolat'], dev['dev_geolng'], dev['dev_name']]);
//console.log(markers);
});
addMarker();
} else {
}
}
});
}
function addMarker() {
console.log(markers);
for (var i = 0; i < markers.length; i++) {
// obtain the attribues of each marker
var lat = parseFloat(markers[i][0]);
var lng = parseFloat(markers[i][1]);
var trailhead_name = markers[i][2];
var myLatlng = new google.maps.LatLng(lat, lng);
var contentString = "<html><body><div><p><h2>" + trailhead_name + "</h2></p></div></body></html>";
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: "Coordinates: " + lat + " , " + lng + " | Trailhead name: " + trailhead_name
});
marker['infowindow'] = contentString;
global_markers[i] = marker;
google.maps.event.addListener(global_markers[i], 'click', function() {
infowindow.setContent(this['infowindow']);
infowindow.open(map, this);
});
}
}
window.onload = initialize;
</script>
は、私はこの1つhttp://jsfiddle.net/kjy112/ZLuTg/で動作するために使用jsfiddleある
すぐに応答していただきありがとうございます。しかし、それは同じ効果があります。私は 'device_list'の' console.log(marker); 'と同じですが、Google Mapにはマーカーはありません。 – jck
あなたのマーカーの(短い)サンプルを表示json結果 – scaisEdge
OMG!ごめんなさい。私はちょうど彼らが表示しない理由をチェックした後、私のDB値が間違ったテーブルフィールドのデータ型( 'lat/lng')のために間違っていることを知りました。コンソールログの結果を確認して、質問を投稿する前に見落としてくれてありがとう。再度ありがとうございました。それは今働いている。 – jck