Question

How do we add the weather overlay option to a Google map, just like on Google my maps?
I’ve searched for it, but i can’t find the answer.

Do i have to call a weather web service?

Answer 1

You can display the WeatherLayer^dev-guide on your map by taking two steps:

First, load the WeatherLayer library by adding the libraries parameter to the URL you use to load the map:

<script type="text/javascript"
  src="http://maps.googleapis.com/maps/api/js?libraries=weather&sensor=false">
</script>

Then, you must create an instance of the google.maps.weather.WeatherLayer^api-doc class, passing any options in a WeatherLayerOptions^api-doc object, and attach the WeatherLayer to the map:

var weatherLayer = new google.maps.weather.WeatherLayer({
  temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
});
weatherLayer.setMap(map);

In addition to the WeatherLayer, there is also a separate google.maps.weather.CloudLayer^api-doc class that you may create in a similar way:

var cloudLayer = new google.maps.weather.CloudLayer();
cloudLayer.setMap(map);

There is no separate library that you must load to use the CloudLayer; adding the libraries=weather parameter to the URL that loads the map makes both the WeatherLayer and the CloudLayer available on your map. There as a Google Maps JavaScript API v3 Example: Weather Layer, that shows the usage of both layers.