百度地图API实战 互动版

在线工具推荐: Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编辑器

LBS云检索获取数据

这一小节我将带大家搞定getHotelInfo函数

1、请求参数

整个课程都是以

http://api.map.baidu.com/geosearch/v3/nearby?ak=ir7jFwBM0tPkLebXl3ScT9cB&geotable_id=135736&location=116.395884,39.932154&radius=10000

以“116.395884,39. 932154”为中心10000米范围内为基础进行筛选的,大家可以根据在LBS云中的数据进行修改。

2、通过ajax请求获取数据

我们通过发送ajax跨域请求,获取数据,我们采用的datatype是jsonp,我们获取到的数据如下图

json

我们需要将contents中的内容取出,如果没有获取到数据,我们将返回相应信息,具体代码如下:

function getHotelInfo(url,next){
    var hotelInfo = [];
    $.ajax({
        type:'get',
        url:url,
        dataType:'jsonp',
        success:function(data){
            var hotel={};
            console.log(data);
            if(data.contents){
                for(var i=0;i<data.contents.length;i++){
                    hotel={};
                    hotel.address = data.contents[i].address;
                    hotel.name = data.contents[i].title;
                    hotel.price = data.contents[i].price;
                    hotel.type = data.contents[i].type;
                    hotel.img = data.contents[i].img;
                    hotel.location = data.contents[i].location;
                    hotelInfo.push(hotel);
                }
                next(null,hotelInfo);
            }
            else{
                next(data.message);
            }
        }
    });
}
在右方代码框填入相应代码,在id为Indo的div中显示获取到的第一个宾馆的地址
hotelInfo[0].address