Skip to main content

Google Weather Layer - Simple Example

    As promised in the last post, we will be having a look at a very simple example that will help us understand how we can use the weather layer effectively in our Google Map applications using the Google Maps API v3. The weather layer is basically a combination of 2 layers - the Weather Layer and the Clouds Layer. The weather layers displays the weather icons and the temperature corresponding that icon whereas the clouds layers displays the cloud cover across the globe. We can choose to display or hide any of these layers. Let us now dive into a very simple code that will help us understand the basics of the Weather Layer library today.



    The output of the above code will appear as seen in the result section above. You will find a map centered at "India" with both the weather and cloud layers enabled!

    Most part of the above code is similar to most other examples you will find on this site. There are just 2 new and important things in this code. Look out for the variables "weather" and "clouds". The variable weather basically holds a new object of the type weatherLayer and has a property called temperatureUnits. The value of this property can either be in degrees Celsius or Fahrenheit. The clouds basically holds a new object of the type cloudLayer. We can choose not to display either of these layers by commenting out the "setMap(map)" lines from the above code.

    Like rest of the examples seen here, this is another simple, easy-to-understand example code using the Google Maps API v3. If you have any queries regarding the code, please feel free to drop a comment and I will be happy to help you with the code.
Labels:

Comments

  1. AnonymousApril 10, 2012 at 11:26 AM

    my basics in GIS are very weak..hw 2 enhance them stepwise...plz suggest

    ReplyDelete
    Replies
    1. Shreerang PatwardhanApril 10, 2012 at 11:55 PM

      You can check out a book Introduction to Geographic Information Systems at http://www.amazon.com/Introduction-Geographic-Information-Systems-Kang-Tsung/dp/0072528117

      Delete

Post a Comment

Please leave your comments here...

Recommended for You

ES6 101 - Class

Spatial Unlimited changes to The UI Dev After being hosted on blogger 😣 for the last 6 years 📆, this page has finally been moved to Github.io This means a few things for you, dear reader! You will be redirected to the new page shortly! ⏩ ⏩ ⏩ Once crapy HTML is now better looking Markdown ! 😍 😍 The entire blog is a Github repo ! 😍 😍 Spatial Unlimited is now The UI Dev 😍 😍
Post a Comment
Read more

CSS - Counter-increment and counter-reset

Today we will take a look at a couple of CSS properties that are usually used together but not very frequently used. We will be talking about the counter-increment and counter-reset properties. As the name suggests counter-increment and counter-reset definitely have something to do with counters. Let's take a look at the example below which will clearly illustrate the usage of these 2 properties. The implementation is very clear and straight-forward. The only question that remains now, can these CSS properties replace the ordered list (ol-li) HTML code? Do let me know your comments and feedback. Would you use these CSS properties against the standard ol-li structure?
Post a Comment
Read more

Side-scrolling web pages issue with Jquery Mobile - Issue #5748

    While developing a Jquery mobile based application, I came across a issue that is observed only on the iOS 6 devices and Android 4.2.2 devices.     What is the issue?         Web pages are side scrolling on iOS6 and Android 4.2.2 devices.     How did I debug the issue?         This bug was in our applications bug tracker for a long time and since I am the lone front-end developer the project that I am working on, my manger was pushing me to close this bug quickly. I had used the perfect mobile meta tag and still the web pages were side-scrolling. None of my divs had width that was going beyond the device widths and still there was this issue. That day, I decided to break down my HTML to pieces, and tested each piece on the dreadful iOS 6 device. I came down to a textbox that had some placeholder text in it and there it was, the issue was glaring me in my face. ...
Post a Comment
Read more

Removing overlays

    "Overlays"....!!! What is this now! Never heard or used it before? You might immediately say "NO"...But, actually all of you have already seen what an overlay is and you have also used it! Now you would say "When!?!?" Well, all of the markers, polylines, polygons that you have created are overlays. Overlays are objects on the map that are tied to latitude/ longitude coordinates, so they move when you drag or zoom the map. Overlays reflect objects that you add to the map to designate points, lines, areas or collection of objects.     Till now we have seen how to create an overlay. In today's example we will see how to remove an overlay. In this example we will create markers on click. But the difference will be that when you create a new marker, the earlier one will disappear from the map. So at any given time there would only be one single marker on the map! Note that removing the marker does not delete the overlay; it simply removes the overlay...
Post a Comment
Read more

KML Layer Example

         Until now, we have covered various examples involving markers, polylines, polygons, i.e. creating overlays. We have also seen other examples to remove overlays! We will now move on to some other concepts. Today we will have a look at what KML is and how to create a KML layer!          Let us first understand what KML is and why is it necessary. KML stands for Keyhole Markup Language which is an XML schema for expressing geographic annotation and visualisation within 2D maps and 3D Earth browsers. The KML file specifies a set of features (place marks, images, polygons, 3D models, textual descriptions, etc.) for display in Google Earth, Maps and Mobile, or any other 3D Earth browser (geobrowser) implementing the KML encoding. Each place always has a latitude and a longitude. Other data can make the view more specific, such as tilt, heading, altitude, which together define a "camera view". ...
Post a Comment
Read more