Ru/API/Google maps

Подключение слоев погоды к каграм Google

Посмотреть пример в работе можно по этой ссылке

Сначала подключаем необходимые библиотеки
   

Создаем карту
var station_list;

var map; var markersArray = []; var iActiveMarker = -1;

jQuery(document).ready(function {

var lat=55.8; var lng=37.5;

var point = new google.maps.LatLng(lat, lng); var myOptions = { zoom: 10, center: point, mapTypeId: google.maps.MapTypeId.ROADMAP };

map = new google.maps.Map(document.getElementById("map"),myOptions); google.maps.event.addListener(map, 'idle', function{		var bounds = map.getBounds;		var ln = bounds.getNorthEast;		var ln2 = bounds.getSouthWest;		var z = map.getZoom;		var myhre = 'http://openweathermap.org/data/getrect?type=city&cnt=200&lat1='+ 			ln2.lat + '&lat2='+ ln.lat + '&lng1=' + ln2.lng + '&lng2='+ ln.lng+			"&cluster=yes&zoom="+z+"&callback=?";		$.getJSON(myhre,getData);	} );

});

Добавляем функцию отрисовывающую слой с метеоданными
function getData(s) {	station_list = s;

if(station_list.cod != '200') { alert('Ошибка '+ JSONobject.message); return; }

deleteOverlays;

infowindow = new google.maps.InfoWindow({		content: "place holder",		disableAutoPan: false	})

for(var i = 0; i < station_list.list.length; i ++){ var p = new google.maps.LatLng(station_list.list[i].lat, station_list.list[i].lng);

var temp = station_list.list[i].temp -273; temp = Math.round(temp*100)/100;

img = GetWeatherIcon(station_list.list[i]); var html_b = ' '+temp+'C ';

var m = new StationMarker(p, map, html_b); m.station_id=i; markersArray.push(m);

}

}

var obj;

function deleteOverlays { var temp_marker; if (markersArray) { for (i in markersArray) { if(obj!=markersArray[i]) { markersArray[i].setMap(null); }   }    markersArray.length = 0; if( temp_marker != undefined ) { markersArray.push(temp_marker); iActiveMarker = -1; } } }

Смотрим на работающий пример
ссылке

API/Google_maps