高德获取数据 三级联动

<?php

$key = '67d98030aca29c4ea5671e21de0818ae';//自己去高德申请即可
$url = 'https://restapi.amap.com/v3/config/district?subdistrict=3&key=' . $key;
$res = file_get_contents($url);

$res = json_decode($res, true);//转换数组
$data = [];

$i=0;
foreach ($res['districts'][0]['districts'] as $province) {
    $data[$i]['name'] = $province['name'];
    $data[$i]['code'] = $province['adcode'];
    foreach ($province['districts'] as $city) {
        $j = 0;
        $data[$i]['children'][$j] = [
            'name' => $city['name'],
            'code' => $city['adcode']
        ];
        $k=0;
        foreach ($city['districts'] as $area) {
            $data[$i]['children'][$j]['children'][$k]['name'] = $area['name'];
            $data[$i]['children'][$j]['children'][$k]['code'] = $area['adcode'];
            $k++;
        }
        $j++;
    }
    $i++;
}

print_r($data);

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,你需要使用高德地图 JavaScript API的`AMap.Geocoder`类来获取经纬度对应的地址信息。可以使用`AMap.Geocoder`的`getAddress`方法,然后在回调函数中获取到市、区、街道等详细地址信息。代码示例如下: ```javascript // 初始化地图 var map = new AMap.Map('mapContainer', { zoom: 13, center: [116.397428, 39.90923] }); // 创建地址解析器实例 var geocoder = new AMap.Geocoder(); // 获取经纬度对应的地址信息 geocoder.getAddress([116.397428, 39.90923], function(status, result) { if (status === 'complete' && result.regeocode) { var addressComponent = result.regeocode.addressComponent; var province = addressComponent.province; // 省份 var city = addressComponent.city; // 城市 var district = addressComponent.district; // 区县 var township = addressComponent.township; // 街道 console.log(province, city, district, township); } }); ``` 获取到市、区、街道等详细地址信息后,你可以使用该信息来获取三级市区联动。具体实现方式可能因前端框架和具体需求而有所不同,以下是一种基本的实现思路: 1. 在HTML中创建三个下拉框,分别用于显示省、市、区信息。 2. 使用AJAX发送请求,获取省份信息列表,并填充到对应的下拉框中。 3. 监听省份下拉框的`change`事件,当省份改变时,根据省份信息获取对应的城市信息列表,并填充到城市下拉框中。 4. 监听城市下拉框的`change`事件,当城市改变时,根据城市信息获取对应的区县信息列表,并填充到区县下拉框中。 代码示例如下: ```html <!-- HTML代码 --> <select id="province"></select> <select id="city"></select> <select id="district"></select> ``` ```javascript // 获取省份信息列表并填充到下拉框中 $.ajax({ url: 'http://localhost:8080/provinces', success: function(data) { var options = ''; for (var i = 0; i < data.length; i++) { options += '<option value="' + data[i].id + '">' + data[i].name + '</option>'; } $('#province').html(options); // 初始化城市和区县下拉框 getCityList(data[0].id); getDistrictList(data[0].id, 1); }, error: function() { alert('获取省份信息失败'); } }); // 监听省份下拉框的change事件,获取对应的城市信息列表并填充到下拉框中 $('#province').change(function() { var provinceId = $(this).val(); getCityList(provinceId); getDistrictList(provinceId, 1); }); // 监听城市下拉框的change事件,获取对应的区县信息列表并填充到下拉框中 $('#city').change(function() { var cityId = $(this).val(); getDistrictList(cityId, 2); }); // 获取城市信息列表并填充到下拉框中 function getCityList(provinceId) { $.ajax({ url: 'http://localhost:8080/cities?provinceId=' + provinceId, success: function(data) { var options = ''; for (var i = 0; i < data.length; i++) { options += '<option value="' + data[i].id + '">' + data[i].name + '</option>'; } $('#city').html(options); }, error: function() { alert('获取城市信息失败'); } }); } // 获取区县信息列表并填充到下拉框中 function getDistrictList(parentId, level) { $.ajax({ url: 'http://localhost:8080/districts?parentId=' + parentId, success: function(data) { var options = ''; for (var i = 0; i < data.length; i++) { options += '<option value="' + data[i].id + '">' + data[i].name + '</option>'; } $('#district').html(options); if (level === 1) { // 如果是省份改变触发的获取区县信息列表,要将区县下拉框重置为空 $('#district').val(''); } }, error: function() { alert('获取区县信息失败'); } }); } ``` 在上面的代码中,`getCityList`和`getDistrictList`函数分别用于获取城市和区县信息列表,并将获取到的信息填充到对应的下拉框中。其中,`parentId`参数表示上级地区的ID,`level`参数表示当前下拉框的级别,用于判断是否需要将下拉框重置为空。你需要根据实际情况修改这些函数的实现。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值