html 当前位置天气js,JS获取本地地址及天气的方法实例小结

本文实例讲述了JS获取本地地址及天气的方法。分享给大家供大家参考,具体如下:

一、获取本地的地址

第一种方式:

1、利用浏览器获取当前位置的经纬度

window.οnlοad=getCurrentPosition;

//浏览器获取当前位置

function getCurrentPosition() {

if (window.navigator.geolocation) {

var options = {

enableHighAccuracy: true,

};

window.navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options);

}else {

alert("浏览器不支持html5来获取地理位置信息");

}

}

2、浏览器获取到的是GPS坐标,需要转换成城市名称再通过城市获取天气:

//成功获取时调用的函数

function handleSuccess(position) {

// 获取到当前位置经纬度 本例中获取到的是gps坐标系

//经度

var lng = position.coords.longitude;

//纬度

var lat = position.coords.latitude;

//转换成百度坐标系

//将请求发送给‘

var ggPoint = new BMap.Point(lng, lat);

//地图初始化

var bm = new BMap.Map();

//坐标转换完之后的回调函数

translateCallback = function (data) {

if (data.status === 0) {//回调成功

var marker = new BMap.Marker(data.points[0]);

var myGeo = new BMap.Geocoder();

var baiduPoint = new BMap.Point(data.points[0].lng, data.points[0].lat);

//将经纬度转换成城市

myGeo.getLocation(baiduPoint, getCityByCoordinate);

}

}

setTimeout(function () {

var convertor = new BMap.Convertor();

var pointArr = [];

pointArr.push(ggPoint);

convertor.translate(pointArr, 3, 5, translateCallback)

}, 2000);

}

function getCityByCoordinate(result) {

var gpsAadress=result.addressComponents;

var city=gpsAadress.city;

//将转换之后的城市传入获取天气的函数做参数

getWeatherDatas(city);

return city;

}

function handleError() {

log('地点定位出错');

}

第二种方式:

1、利用百度API通过IP地址获取本地地址

//通过百度的 IP地址获取本地地址

window.οnlοad=getCurrentPosit;

function getCurrentPosit() {

var map = new BMap.Map('getCity');

function myFun(result){

var cityName = result.name;

getWeatherDatasFun(cityName);

map.setCenter(cityName);

alert("当前定位城市:"+cityName);

}

var myCity = new BMap.LocalCity();

myCity.get(myFun);

2、通过城市获取天气数据:

function getWeatherDatas(city) {

var url='http://route.showapi.com/9-2?';

if(city===undefined || city===""){

log('您还未输入')

}else {

$.ajax({

type: 'post',

url: url,

dataType: 'jsonp',

data: {

"showapi_timestamp": new Date().getTime(),

"showapi_appid": '44277', //这里需要改成自己的appid

"showapi_sign": '9987d6dff19e482488b33dc8ed70f6e9', //这里需要改成自己的应用的密钥secret,

"area":city

},

jsonp: 'jsonpcallback', //这个方法名很重要,不能改变

error: function(XmlHttpRequest, textStatus, errorThrown) {

log("操作失败,请重试!"+errorThrown);

},

success: function(result) {

//解析获取到的天气数据

console.log('The Weather datas: ',result);

}

});

}

}

希望本文所述对大家JavaScript程序设计有所帮助。