高德地图判断地址输入是否正确

开发中经常会遇到判断地址输入是否正确,如果项目中集成了高德地图的SDK,那么为什么不用ta?

1、声明控件:

   // 地理编码
    private static GeocodeSearch geocoderSearch;

2、在onCreate中创建实例:
 
  geocoderSearch = new GeocodeSearch(context);
    geocoderSearch.setOnGeocodeSearchListener(geoLis);

3、创建方法,用来响应地理编码:
 
   /**
     * 响应地理编码(在拿到城市路径之后调用)
     */
    public void getLatlon(String address) {
        // 第一个参数表示地址,第二个参数表示查询城市,中文或者中文全拼,citycode、adcode,
        GeocodeQuery query = new GeocodeQuery(address, "");
        // 设置同步地理编码请求
        geocoderSearch.getFromLocationNameAsyn(query);
    }

4、对第二部设置的响应地理编码的监听做处理:
/**
     * 编码异步处理
     */
    private OnGeocodeSearchListener geoLis = new OnGeocodeSearchListener() {

        /**
         * 逆地理编码回调
         */
        @Override
        public void onRegeocodeSearched(RegeocodeResult arg0, int arg1) {

        }

        /**
         * 地理编码查询回调
         */
        @Override
        public void onGeocodeSearched(GeocodeResult result, int rCode) {
            if (rCode == 1000) {
                if (result != null && result.getGeocodeAddressList() != null
                        && result.getGeocodeAddressList().size() > 0) {
                    //地址输入正确,在这里调用输入正确地址后的操作
                    //这里也可以获取到经纬度坐标,具体代码如下
                 //GeocodeAddress addressCode = result.getGeocodeAddressList().get(0);
                    //纬度:addressCode.getLatLonPoint().getLatitude()  
                    //经度:addressCode.getLatLonPoint().getLongitude() 
                } else {
                    ToastUtil.show("请输入正确的家庭地址");
                    return;
                }
            }
        }
    };


在Vue3中使用高德地图输入地址进行标记的基本步骤通常包括以下几个阶段: 1. 注册高德开放平台账号并获取API Key。 2. 在Vue3项目中安装高德地图的npm包,例如使用`npm install @amap/amap-jsapi-loader`。 3. 在组件中引入并使用`@amap/amap-jsapi-loader`进行地图实例的加载。 4. 使用高德地图提供的服务,如地址解析服务(GeocodingService),将用户输入地址转换为地图上的经纬度坐标。 5. 将获取到的经纬度坐标作为参数,创建标记(Marker)并添加到地图上显示。 以下是一个简单的示例代码,展示了如何在Vue3中实现输入地址后标记地图: ```javascript <template> <div id="mapContainer" style="width: 100%; height: 500px;"></div> <input v-model="address" placeholder="输入地址" /> <button @click="addMarker">标记</button> </template> <script setup> import { ref, onMounted } from 'vue'; import AMapLoader from '@amap/amap-jsapi-loader'; const address = ref(''); const map = ref(null); onMounted(async () => { await AMapLoader.load({ key: '你的API Key', // 替换为你的API Key version: '2.0', // 高德地图JS API的版本号 plugins: ['AMap.Geocoder'], // 需要使用的插件列表 }); map.value = new AMap.Map('mapContainer', { zoom: 10, }); }); const addMarker = async () => { if (!map.value) { return; } const geocoder = new AMap.Geocoder(); geocoder.getAddress(address.value, (status, result) => { if (status === 'complete' && result.info === 'OK') { const marker = new AMap.Marker({ map: map.value, position: result.regeocode.formattedAddress, // 使用地址解析的结果 }); map.value.setFitView(); // 地图自适应显示所有标记 } else { alert('地址解析失败,请检查输入地址是否正确!'); } }); }; </script> <style> #mapContainer { width: 100%; height: 500px; } </style> ``` 在上述代码中,首先在页面上提供了一个输入框用于用户输入地址,并且有一个按钮用于触发地址标记的动作。在`mounted`生命周期钩子中加载高德地图的JSAPI,并创建一个地图实例。`addMarker`方法则利用高德地图的地理编码服务将用户输入地址转换为经纬度,并创建一个标记添加到地图上。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值