Google maps v3 heatmap не отображается при загрузке страницы
У меня есть страница отображения, которая получает ответ json и создает соответствующий массив точек для загрузки тепловой карты.
Все это находится в требуемом запросе initialize, который загружается и вызывается в документе jquery.готовый.
Вот странная вещь, хотя, все внешние данные возвращаются нормально и заполняются нормально, массив точек также хорошо.
Однако, когда я вызываю метод setMap (map) на тепловой карте, он не отображается. Но странно, если я использую on ссылка на страницу, чтобы включить или выключить его, будет отображаться. Есть идеи?? В firebug вообще нет ошибок.
var map;
var markers = [];
var markerLatLngArray = [];
function toggleHeatmap() {
heatmap.setMap(heatmap.getMap() ? null : map);
}
function initialize() {
var map_options = {
center: new google.maps.LatLng(53.4902, -7.96),
zoom: 7,
mapTypeId: google.maps.MapTypeId.TERRAIN,
draggableCursor: 'crosshair',
mapTypeControl: true,
scaleControl: true,
streetViewControl: false,
overviewMapControl: false,
overviewMapControlOptions: {
opened: false
}
};
map = new google.maps.Map(document.getElementById('map_canvas'), map_options);
google.maps.event.addListenerOnce(map, 'idle', function(){
document.getElementById('ajax_loading_icon').style.display = "none";
document.getElementById('map_canvas').style.visibility = "visible";
});
jQuery.get("<?php echo $data_url; ?>", {}, function(data) {
jQuery(data).find("marker").each(function() {
var marker = jQuery(this);
var latlng = new google.maps.LatLng(parseFloat(marker.attr("lat")),
parseFloat(marker.attr("long")));
markerLatLngArray.push(latlng);
});
});
pointArray = new google.maps.MVCArray(markerLatLngArray);
heatmap = new google.maps.visualization.HeatmapLayer({
data: pointArray
});
heatmap.setMap(map);
}