高德地图 天气预报查询
生活随笔
收集整理的這篇文章主要介紹了
高德地图 天气预报查询
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
AMap.Weather 天氣查詢服務(wù),提供城市/區(qū)縣天氣預(yù)報(bào)服務(wù)
高德地圖為我們提供了天氣預(yù)報(bào)的查詢接口,通過該插件,我們可以獲取到未來幾天的天氣預(yù)報(bào)詳情,這對于想優(yōu)化app與客戶之間的聯(lián)系是提供了極大的方便的。
以下為官網(wǎng)api
由api我們可知,weather插件分別為我們提供了實(shí)時(shí)天氣信息和未來4天的天氣預(yù)況,通過該方法我們可以獲取相應(yīng)的對象進(jìn)而獲取相應(yīng)的信息。由示例:
<!doctype html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="chrome=1"><meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width"><style type="text/css">body,html{height: 100%;margin: 0px;}#container{height: 50%;margin: 0px;}#result{height: 50%;margin: 0px;}#weather {height: 180px;background-color: #fff;padding-left: 10px;padding-right: 10px;position: absolute;bottom: 20px;font-size: 12px;right: 10px;border-radius: 3px;line-height: 20px;border: 1px solid #ccc;}.weather{width: 60px;padding-left: 8px;display: inline-block;}</style><title>快速入門</title></head><body><div id="container" tabindex="0"></div><div id="tip" style="line-height: 24px"></div><script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=你的api"></script><script type="text/javascript">var geocoder; var map = new AMap.Map('container', {resizeEnable: true,});AMap.service('AMap.Weather', function() {var weather = new AMap.Weather();//查詢實(shí)時(shí)天氣信息, 查詢的城市到行政級別的城市,如朝陽區(qū)、杭州市weather.getLive('珠海市', function(err, data) {if (!err) {var str = [];str.push('<div style="color: #3366FF;">實(shí)時(shí)天氣' + '</div>');str.push('<div>城市/區(qū):' + data.city + '</div>');str.push('<div>天氣:' + data.weather + '</div>');str.push('<div>溫度:' + data.temperature + '℃</div>');str.push('<div>風(fēng)向:' + data.windDirection + '</div>');str.push('<div>風(fēng)力:' + data.windPower + ' 級</div>');str.push('<div>空氣濕度:' + data.humidity + '</div>');str.push('<div>發(fā)布時(shí)間:' + data.reportTime + '</div>');var marker = new AMap.Marker({map: map, position: map.getCenter()});var infoWin = new AMap.InfoWindow({content: str.join(''),offset: new AMap.Pixel(0, -20)});infoWin.open(map, marker.getPosition());marker.on('mouseover', function() {infoWin.open(map, marker.getPosition());});}});//未來4天天氣預(yù)報(bào)weather.getForecast('珠海市', function(err, data) {if (err) {return;}var str = [];for (var i = 0,dayWeather; i < data.forecasts.length; i++) {dayWeather = data.forecasts[i];str.push(dayWeather.date+' <div class="weather">'+dayWeather.dayWeather+'</div> '+ dayWeather.nightTemp + '~' + dayWeather.dayTemp + '℃');}document.getElementById('tip').innerHTML = str.join('<br>');});});</script></body>
</html>
運(yùn)行所得
總結(jié)
以上是生活随笔為你收集整理的高德地图 天气预报查询的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: NWERC 2018 C. Circui
- 下一篇: NWERC 2018 A. Access