Tag Archives: javascript

Getting Weather from Weather.gov using Javascript and JQuery

I had a simple task to get a 7 day forecast of the high and low temperatures. To start off with, I looked at a number of sources to get this information from. Here is a good discussion about weather APIs, mostly geared toward iPhone.

I decided to go with the NOAA Rest service, and get the data from Weather.gov.

Also, I ended up publishing it on Github if you want the full source.

The first step I did was use jQuery to hit the NOAA URI with the appropriate parameters:

$.get('http://graphical.weather.gov/xml/SOAP_server/ndfdXMLclient.php?whichClient=NDFDgenMultiZipCode&zipCodeList=' + zip +'&product=time-series&maxt=maxt&mint=mint&Submit=Submit'

This would return a huge XML structure which then needs to be parsed.

// Parse the XML response to get out the values we want
$(xml).find('temperature').each()
...
// Iterate over the day values and assigne to the right array
$(this).find('value').each(function(){
array[count] = $(this).text();
count = count + 1;
});

I guess the overall takeaway is that the NOAA provides a free interface to getting facts about the weather, though it seems like that interface may have been designed a while back, since it is a little cumbersome to use.

If you want more data than just the highs and lows for temperature, check out this website which shows you all the different options you can query for.

Tagged , ,

HOW TO GET DOMAIN OBJECTS IN JAVASCRIPT WITH RAILS (PART 2)

The next step in the sequence for loading Rails objects in javascript is to dynamically get them from the script. To do this, I’m going to use the JQuery “Get” method. I’ll be hitting the same URL that I set up in the last post.

Once I get the object, I’ll just add a simple alert method to the script, so I can be sure that I loaded the data correctly (or you could use a javascript debugger…).

    $.get("/restaurants/recommendations", function(restaurant) {
      alert("successfully loaded: " + JSON.stringify(restaurant));
    });

Once I’ve confirmed that I have the correct object, I want to get the latitude and longitude values from the object and create a marker on the map that I have already set up.

  $.get("/restaurants/recommendations", function(restaurant) {  
    
    var myMarkerLatLng = new CM.LatLng(restaurant.lattitude, restaurant.longitude);
    var myMarker = new CM.Marker(myMarkerLatLng, {
      title: restaurant.name
    });
    map.addOverlay(myMarker);
    
  });

When I put it all together the entire javascript function looks like this:

$(document).ready(function(){ 
  
  var cloudmade = new CM.Tiles.CloudMade.Web({key: 'my_key'});
  var map = new CM.Map('map_canvas', cloudmade);

  map.setCenter(new CM.LatLng(35.998743, -78.90723), 13);
  map.addControl(new CM.LargeMapControl());

  $.get("/restaurants/recommendations", function(restaurant) {  
    
    var myMarkerLatLng = new CM.LatLng(restaurant.lattitude, restaurant.longitude);
    var myMarker = new CM.Marker(myMarkerLatLng, {
      title: restaurant.name
    });
    map.addOverlay(myMarker);
    
  });
    
    
});

And I get to see my “Watts Grocery” marker on the map.

Tagged , , , , ,

How to get domain objects in javascript with rails (Part 1)

In continuing with my side project relating to maps and restaurants, I wanted to get things a little more interactive.  The next step is to combine all my restaurants I have the in database, and put them on the map.  To do this though, I needed to get the Restaurant Model objects into javascript so I could dynamically add them to as markers on the map.

The first step was to define a new controller action in my “app/controllers/restaurants_controller.rb” file.  For now, this will just find the first item in the DB and render it as a JSON object.  In the long run, this will return a list of recommended restaurants:

  def recommendations
    @restaurant = Restaurant.find(:first)
    render :json => @restaurant
  end

Next, I needed to make that controller accessible via a URL.  My initial idea is to open up the URL like “/restaurants/recommendations” to return the list.  I modified the “config/routes.rb” file, and restarted the server:

  match "/restaurants/recommendations" => "restaurants#recommendations"

If I point the browser to this URL, I see the JSON I was expecting to see.  In this case, it is returning the restaurant “Watts Grocery”:

{
"name":"Watts Grocery",
"city":null,
"created_at":"2012-03-12T02:08:29Z",
"description":null,
"id":4,
"lattitude":"36.0164193",
"longitude":"-78.9189592",
"openmap_id":266302295,
"state":null,
"updated_at":"2012-03-12T02:08:29Z"
}

Next up, I’ll show how to make a call in javascript to get this JSON string and parse it into an object so it can be displayed on the map.

 

Tagged , , ,