Creat Javascript or .Net or Php scrip that can parse xml link and display an image

I am not sure the best way to do this, but bascially what i want is to build a small weather widget for my personal website.

I have downloaded some nice weather icons, however i would like to display them depending on the current weather.  

One option is to use the weather.com API, however since I live in Hong Kong, i want to use the data from The Hong Kong observatory XML feed.

They do no have a API, but they provide a rss feed, located here :

http://rss.weather.gov.hk/rss/LocalWeatherForecast.xml

I would like to be able to pick out words based on the rss feed and then display a image based on those words..

Any idea?

Thanks.
Ricky11Asked:
Who is Participating?
 
Michel PlungjanIT ExpertCommented:
Here
<hmtl>
<head>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<!-- Load RSS Through Google as JSONP http://code.google.com/apis/feed/v1/ -->

<!--
{"responseData": {"feed":{"feedUrl":"http://rss.weather.gov.hk/rss/LocalWeatherForecast.xml","title":"Local Weather Forecast","link":"http://www.weather.gov.hk/wxinfo/currwx/flw.htm","author":"","description":"Local Weather Forecast","type":"rss20","entries":[{"title":"Bulletin updated at 13:45 HKT 23/12/2011","link":"http://www.weather.gov.hk/wxinfo/currwx/flw.htm","author":"Hong Kong Observatory","publishedDate":"Thu, 22 Dec 2011 21:45:00 -0800","contentSnippet":"The winter monsoon is bringing cold weather to inland Guangdong. Locally, temperatures over the territory this morning were ...","content":"The winter monsoon is bringing cold weather to inland Guangdong. Locally, temperatures over the territory this morning were generally 3 to 5 degrees lower than those of yesterday.\u003cbr\u003e\u003cbr\u003e\n\t\t\t\t\t\t\t\t\t\tWeather forecast for this afternoon and tonight:\u003cbr\u003eFine and dry. Hazy at first. It will be cold overnight. Moderate northerly winds, becoming fresh gradually, occasionally strong offshore overnight.\u003cbr\u003e\u003cbr\u003e\n\t\t\t\t\tOutlook: Fine and very dry in the next few days. It will be cold with temperature below 12 degrees in the mornings.","categories":["F"]}]}}, "responseDetails": null, "responseStatus": 200}
-->
<script type="text/javascript">

  function displayWeatherReport (feedResponse) {
   var feed = feedResponse.responseData.feed;

   var feedTitle = feed["title"];

   var data = feed.entries[0];
   var publishedDate = data.publishedDate.substring(0,17);
   var title = data.title;
   var text = data.content;

//   for (var o in data) text += '<br>'+o+':'+data[o]
   //$("body").append(text)

    // Get weather report content strings
    var html = '<h3>'+feedTitle+'</h3>'
    html += '<h4>'+title+'</h4>'
    html += '<p>'+text+'</p>'
    if (text.indexOf('rain')!=-1) html += '<img src="rain.gif" alt="rain" />';

    $('body').append(html);
  }

  var RSSFeed = "http://rss.weather.gov.hk/rss/LocalWeatherForecast.xml";
  var URL = 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=' + encodeURIComponent(RSSFeed)+'&callback=displayWeatherReport';

    $(document).ready(function() {
       var scr = document.createElement("script");
       scr.src = URL;
       document.getElementsByTagName("head")[0].appendChild(scr);
    });

</script>
</head>
<body>
Weather<br/>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
You need serverside.

Here is an example:


<?PHP
$rss = file_get_contents('http://rss.weather.gov.hk/rss/LocalWeatherForecast.xml');

echo $rss;
if (stristr($rss,"rain")) echo '<img src="rain.gif" />';
?>

Open in new window

0
 
Ricky11Author Commented:
Thanks, Unfortunately I found out my webhost (weebly.com) only allows HTML, CSS, and Javascript

Anyway to do it in java script?

Thanks.
0
 
Ricky11Author Commented:
Thanks , that looks like it works. last thing how would i format it, as now it runs of the page.

Can i apply some code to test the feed and display a certain image based on key words?
0
 
Michel PlungjanIT ExpertCommented:
You cannot format the text but I put in a test for rain
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.