Google Map Api 和Google Weather Api实践之天气预报

     Google Weather Api可以接受经纬度坐标当参数来获取指定经纬度的天气情况，如湿度，风向等，同时也可以获取该点的后5天的天气预报情况。所以有了个想法，就是将Google Weather Api支持的城市的天气情况，然后结合到GoogleMap中，可以直观显示出主要城市的天气情况。首先需要将天气情况存储到数据库中，用以后面的天气情况的显示。如下是针对Google Weather Api的调用并解析（Api调用地址： string GWP_Url = "http://www.google.com/ig/api?hl=zh-cn&weather=,,,{0},{1}";），发送请求解析保存到指定的数据库表。

 

Code
 1         HttpWebRequest GWP_Request;
 2         HttpWebResponse GWP_Response = null;
 3         XmlDocument GWP_XMLdoc = null;
 4         string GWP_Url = "http://www.google.com/ig/api?hl=zh-cn&weather=,,,{0},{1}";
 5         System.Text.StringBuilder xmlHtml = new System.Text.StringBuilder();
 6         try
 7         {
 8             GWP_Request = (HttpWebRequest)WebRequest.Create("http://www.google.com/ig/cities?output=xml&hl=zh-cn&country=cn");
 9             GWP_Request.UserAgent = @"Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4";
10             GWP_Request.ContentType = "application/x-www-form-urlencoded";
11             GWP_Response = (HttpWebResponse)GWP_Request.GetResponse();
12             GWP_XMLdoc = new XmlDocument();
13             GWP_XMLdoc.Load(GWP_Response.GetResponseStream());
14             XmlNodeList xnl = GWP_XMLdoc.GetElementsByTagName("city");
15 
16             if (xnl.Count > 0)
17             {
18                 DeleteWeatherInfo();
19                 foreach (XmlNode xn in xnl)
20                 {
21                     HttpWebRequest GWP_Request_temp;
22                     HttpWebResponse GWP_Response_temp = null;
23                     XmlDocument GWP_XMLdoc_temp = null;
24                     GWP_Request_temp = (HttpWebRequest)WebRequest.Create(string.Format(GWP_Url, xn.ChildNodes[1].Attributes["data"].Value.ToString(), xn.ChildNodes[2].Attributes["data"].Value.ToString()));
25                     GWP_Request_temp.UserAgent = @"Mozilla/4.0(compatible;MSIE 6.0;Windows NT 5.1;)";
26                     GWP_Request_temp.ContentType = "application/x-www-form-urlencoded";
27                     GWP_Response_temp = (HttpWebResponse)GWP_Request_temp.GetResponse();
28                     GWP_XMLdoc_temp = new XmlDocument();
29 
30                     GWP_XMLdoc_temp.Load(XmlReader.Create(GWP_Response_temp.GetResponseStream()));
31 
32                     if (GWP_XMLdoc_temp.SelectNodes("xml_api_reply/weather/current_conditions")[0] != null)
33                     {
34                         xmlHtml.Append("城市名称：" + xn.FirstChild.Attributes["data"].Value.ToString() + "   纬度： " + xn.ChildNodes[1].Attributes["data"].Value.ToString() + "  经度：" + xn.ChildNodes[2].Attributes["data"].Value.ToString() + GWP_XMLdoc_temp.SelectNodes("xml_api_reply/weather/current_conditions")[0].SelectSingleNode("condition").Attributes["data"].InnerText.ToString() + "  预报时间：" + DateTime.Parse(GWP_XMLdoc_temp.SelectNodes("xml_api_reply/weather/forecast_information")[0].SelectSingleNode("current_date_time").Attributes["data"].InnerText.ToString()).ToLocalTime().ToString() + "<br/>");
35                     }
36                     else
37                     {
38                         xmlHtml.Append("城市名称：" + xn.FirstChild.Attributes["data"].Value.ToString() + "   纬度： " + xn.ChildNodes[1].Attributes["data"].Value.ToString() + "  经度：" + xn.ChildNodes[2].Attributes["data"].Value.ToString() + "<br/>");
39                     }
40                     InsertWeatherInfo(xn.FirstChild.Attributes["data"].Value.ToString(), xn.ChildNodes[2].Attributes["data"].Value.ToString(), xn.ChildNodes[1].Attributes["data"].Value.ToString(), GWP_XMLdoc_temp.OuterXml.ToString());
41                     GWP_Response_temp.Close();
42 
43                 }
44 
45             }
46             GWP_Response.Close();

     获取对应的信息即可开始显示在地图上了，数据库表中有对应的经纬度信息，和相应的天气预报情况。 这里主要使用Google Map Api的GInfoWindowTab类显示对应以后每天的天气预报情况。点击查看在线Demo，GoogleMap显示天气预报信息 详细代码如下：

 

Code
 var jsWeathers = Ext.util.JSON.decode(result.responseText); 
    for (var i = 0; i < jsWeathers.length; i++) {
        var lat = jsWeathers[i].Lat * 0.000001;
        var lon = jsWeathers[i].Lon * 0.000001;
        var point = new GLatLng(lat, lon);
        var mark = new GMarker(point, { icon: getWeatherIcon(jsWeathers[i].WeatherInfos[0].Icon) });
        var infoTabs = [];
        for (var k = 0; k < jsWeathers[i].WeatherInfos.length; k++) {
            if (k == 0) {
                infoTabs.push(new GInfoWindowTab(jsWeathers[i].WeatherInfos[k].DayOfWeek, "城市:" + jsWeathers[i].CityName + "<br/>天气:" + jsWeathers[i].WeatherInfos[k].Conditon + "<br/>" + jsWeathers[i].WeatherInfos[k].Humidity + "<br/>" + jsWeathers[i].WeatherInfos[k].WindCondition));
            }
            else {
                infoTabs.push(new GInfoWindowTab(jsWeathers[i].WeatherInfos[k].DayOfWeek, "天气:" + jsWeathers[i].WeatherInfos[k].Conditon + "<br/>" + "最高温度：" + jsWeathers[i].WeatherInfos[k].High + "<br/>" + "最低温度：" + jsWeathers[i].WeatherInfos[k].Low));
            }
        }
        mark.infoTabs = infoTabs;
        map.addOverlay(mark);
        (function(mark, infoTabs) {
            GEvent.addListener(mark, "mouseover", function() {
                mark.openInfoWindowTabsHtml(infoTabs);
            });
        })(mark, infoTabs);