RE: XML - Graphical Weather Feed

[mrshybee]

I'm looking for any knowledge on how to producse weather content similar to AccuWeather's SWF modules.

http://www.accuweather.com/adc2004/p...e.asp?header=m

Can anyone point me in the right directoin?

~ Brian

[villain2]

First thing you should do is go to weather.com and sign up for their affiliate program to use their xml feeds for daily weather.

Then, it's a matter of what you specifically want to do with them. Do you want users to search for their area? Do you want a five day forecast?

[mrshybee]

Thanks for the reply. I need a 7 day GRAPHICAL forcast. I can do the text feeds, but I'm really in need of one with graphics - that will auto update (sun, rain, clouds).

Any help?

[villain2]

Yes, the weather channel feeds include their own graphics in them.

Go to http://xoap.weather.com/services/oap...homewxanywhere and sign up. I believe that's still the link for getting syndicated with weather.com (I'm not sure since it's been years since I got my account). They will set you on the right path to syndicating weather feeds.

Then, it's simply pulling the nodes from the feeds (requires a working knowledge of xml). It should look something like this:

<icon>30</icon>

The <icon> tag, when you display it, will have to be appended with .jpg or .gif. That determines the weather image displayed. Each number corresponds with a particular weather condition. Like say 30 was for Sunny, then your 30.jpg image would be of a sun.

They suggest that you use their weather icons that you get when you sign up with the service, but I've seen many who do it with their own custom made icons. Just make sure you include the Weather.com logo on your site or you'll get booted from the system.

[mrshybee]

It's actually for digital signage. I need the forcast to be 1024 x 768???

[villain2]

Doesn't matter what the size is. You're using the xml file to feed the data into your display page. You make the page any size you want. You can make the weather images any size you want.

The xml feed from weather.com just gives you the raw data ... time, day, wind, sunrise, sunset, AND the <icon> tag corresponds with the weather type. You need to parse the xml.

For example, if you'll get an xml file similar to this:

<day>Thurs</day>
<icon>25</icon>
<srise>5:40AM</srise>
<sset>8:34PM</sset>

You would take this data from the xml and place it anyway you like in your digital display. And again, the <icon> tag designates what image is associated with the weather conditions. You will have to append .jpg to the end of the number when you display it. You could even make your own and append .swf to the end to have a sun with moving clouds or rain with drops coming down (although I imagine the load time would be slower).

This is an old one (hope it still works) that isn't complete, but should show you basically what the idea is:
http://www.webchannel24.com/Weather/

Again, that link is under construction but you should be able to see a graphical weather display.

Is this for one location or are you displaying weather for more than one city/area?

I'm not too sure on the extent of your xml or (if you're doing this in flash) actionscript knowledge, but when you get the xml, feel free to respond here and I'll help you along with pulling out the information from the xml feed. Once you understand how to pull the info, it's really not hard at all.

[mrshybee]

Villian,

Thanks for the quick replies. I'm doing this in flash - as the file needs to be [SWF], however I've worked with XML and RSS feeds in websites before. I just don't even know where do start when getting these graphics to change. Do you know if there are any examples out there?

~ Brian

[mrshybee]

Ya - that link didn't work. An no - I will just be displaying the 7-day forcast for the entire state of Minnesota.

[villain2]

Sorry about the link.
I don't think I'm explaining this correctly.

when you get the xml file from the weather channel, THEY update the feed several times a day. That means, the <icon> tag will change if the weather changes.

For instance, at 2:30pm the weather could be cloudy, and the icon tag is <icon>22</icon>. Then, when weather.com updates the xml feed at 2;45pm, it could be clear, which then the icon would be <icon>26</icon>.

They give you the graphics. All you have to do is put them in a folder and when you call the xml in your flash movie, append ".jpg" to the end.

example:
Draw loader boxes on your movie frame where the xml is loaded and call the loader boxes "Icon0", "Icon1", "Icon2" and so on for all seven days.

Parse the xml through the usual actionscript method

When you're pulling the images, you would do it like this:

this.ref["Icon"+i].loadMovie("icon_folder/"+subnodes[5].firstChild.toString()+".jpg")

Now, since you're doing a stand alone kiosks, you'll have to have a refresh script that will reload the xml every ten minutes or so. When the xml feed is updated by weather.com, your images will change (if the weather conditions change) and your information will be updated on each refresh.

Here is an example where you can see there are five loader boxes:

[mrshybee]

Wow - that looks really good. Would you be willing to send me your original code? I'd like to see how this all works..

~ Brian

[mrshybee]

I'm wondering if I couldn't build a 7 day forcast out of flash - similar to the one you've built in HTML?

[villain2]

That was done in Flash btw.

I never send out my full code, but I can help you with yours. Again, start by getting a rss account with the weather channel.

[switchone]

villain2,

I was wondering if you have you use any crossdomain files or System.security.allowDomain() code in your actionscript. I made an account on weather.com and recieved an id and key. However, I am having errors loading the weather.com data into flash. I used a basic xml method to load the url. It works fine if I run the .swf locally from my machine, but was it is uploaded, the xml will not load.

Any ideas?

[villain2]

Use a proxy script on your own domain to load the xml data from the weather.com site.

For example, in php it would be:

$dataURL = "http://www.weather.com/your_weatherchannel_account_address";

//note that this will not follow redirects
readfile($dataURL); 

Name this file weather_proxy.php or whatever.

Then, write your actionscript to read the xml from that file. This gets around the need to write a security.allowDomain script.

[infralilla]

Is there any demo or fla file to look at? So I can understand it better?
Has anyone ever managed to make anything like this?... Im starting to dubt..
I have been googeling for many hours and have asked almost everywhere.. But... nothing.. can anyone help a bit more whit this problem? plz.

[villain2]

I'm not one for displaying my source code online, but we can go through how to set this up. First and foremost, get a weather feed from Weather.com or Accuweather. Then, write the proxy code as seen above so you can use the xml on our flash site.

From there, it's an understanding of how to load xml data into your flash movie (which there are tons of tutorials on that online).

For searching by zipcode, you will need an understanding of LoadVars to sendAndLoad data from your flash front end that will rewrite the source proxy file. (ie. if there is a space for zipcode in the xml file address you get from weather.com - which there is - you can send the zipcode the user inputs as part of the proxy script code).

Let me know where you are with this project and we can go from there.

[villain2]

for reference:

http://webchannel24.com/index.php?co...her/#/Weather/

Here's a rough example of a weather feed in flash. Just enter in your zipcode and click on send.

[infralilla]

I must have a autoupdate weather. With a pre entered zip code.
So the weather just shows. And nothng more.

do you have that?

[villain2]

Then you just use the zipcode you want in the proxy file. Perhaps you should sign up for a weather feed service first and then go from there (accuweather or weather.com).

[infralilla]

okay, thank you. Now i have a xml. I get one from www.storm.no every day now. here is the xml file.

<?xml version="1.0" encoding="ISO-8859-1" ?>
- <wod>
- <pointforecast>
<name>OSLO</name>
<datetime>20050929080000</datetime>
<winddirection>138</winddirection>
<windspeed>4</windspeed>
<cloudcover>75</cloudcover>
<temperature>8</temperature>
<prec06>0</prec06>
<mslp>1005</mslp>
<symbol>4</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20050929140000</datetime>
<winddirection>171</winddirection>
<windspeed>4</windspeed>
<cloudcover>70</cloudcover>
<temperature>11</temperature>
<prec06>1</prec06>
<mslp>1004</mslp>
<symbol>9</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20050929200000</datetime>
<winddirection>258</winddirection>
<windspeed>1</windspeed>
<cloudcover>92</cloudcover>
<temperature>9</temperature>
<prec06>3</prec06>
<mslp>1006</mslp>
<symbol>9</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20050930080000</datetime>
<winddirection>352</winddirection>
<windspeed>3</windspeed>
<cloudcover>30</cloudcover>
<temperature>8</temperature>
<prec06>0</prec06>
<mslp>1014</mslp>
<symbol>2</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20050930140000</datetime>
<winddirection>184</winddirection>
<windspeed>2</windspeed>
<cloudcover>79</cloudcover>
<temperature>9</temperature>
<prec06>0</prec06>
<mslp>1015</mslp>
<symbol>4</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20050930200000</datetime>
<winddirection>148</winddirection>
<windspeed>4</windspeed>
<cloudcover>98</cloudcover>
<temperature>9</temperature>
<prec06>1</prec06>
<mslp>1011</mslp>
<symbol>9</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20051001140000</datetime>
<winddirection>187</winddirection>
<windspeed>3</windspeed>
<cloudcover>99</cloudcover>
<temperature>13</temperature>
<prec06>2</prec06>
<mslp>1001</mslp>
<symbol>9</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20051002140000</datetime>
<winddirection>77</winddirection>
<windspeed>1</windspeed>
<cloudcover>6</cloudcover>
<temperature>12</temperature>
<prec06>0</prec06>
<mslp>1016</mslp>
<symbol>1</symbol>
</pointforecast>
- <pointforecast>
<name>OSLO</name>
<datetime>20051003140000</datetime>
<winddirection>213</winddirection>
<windspeed>2</windspeed>
<cloudcover>79</cloudcover>
<temperature>14</temperature>
<prec06>0</prec06>
<mslp>1018</mslp>
<symbol>4</symbol>
</pointforecast>
</wod>