微信小程序开发--当前位置的详细地址获取&&&&城市列表获取-具体到:省--市--区、县级市---乡镇、街道

1. 申请开发者密钥(key):申请密钥

2. 下载微信小程序JavaScriptSDK,微信小程序JavaScriptSDK v1.0

3. 安全域名设置,在“设置” -> “开发设置”中设置request合法域名,添加https://apis.map.qq.com

4.在核心类介绍中查看(http://lbs.qq.com/qqmap_wx_jssdk/qqmapwx.html)getCityList()、getDistrictByCityId(options:Object)方法

5.注意在pages页面创建一个文件夹,文件夹内只有js文件,把wxml,wxss,json文件都删了,把qqmap-wx-jssdk.js文件放入到相应文件夹中,导入文件的语句为:

var QQMapWX = require('../libs/qqmap-wx-jssdk.js');

刚开始使用时,总是出错,文件位置放不对,文件里面的wxml,wxss,json文件没有删,文件路径也不断尝试导入路径前是写 '../ '或'../../',还是不写'../'和'../../',
而且在app.json中把刚才创建用来存api,js文件的路径删了,当时运行时总是报错,后来就把路径删了
总之测试了各种写法,花了几个小时,都崩溃了,好在最后摸索出来了,最后才没有报错,所以想写这篇文章,可以帮助大家,快速的设置,避免出现各种错误。

实例:代码如下:

var QQMapWX = require('../libs/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
  data: {
  },
  onLoad: function (options) {
    qqmapsdk = new QQMapWX({
      key:'your_key'//开发者的key
    });
  },
  onReady: function () {
    var that = this;
    var num;
    var num2;
    var num3;
    //获取当前位置的详细信息
    wx.getLocation({ 
      type: 'wgs84',
      success: function (res) {
       // console.log(res)
       // wx.getLocation 获取当前的地理位置,latitude(维度)  longitude(经度)
        var latitude1 = res.latitude
        var longitude1 = res.longitude
        qqmapsdk.reverseGeocoder({////腾讯地图api 逆解析方法,传入参数为经纬度
          location: {
            latitude: latitude1,
            longitude: longitude1
          },
          success: function (res) {//逆解析成功时回调函数,res包含地理位置信息
            //console.log(res); 
            console.log('res');   
          }
        });
      }
    });
    /*直辖市如:北京:市(一级)、区(二级)id都是六位,(街道)第三级id是九位*/
    /*省-如:陕西:省(一级)、市(二级)、县级市、区(三级)id都是六位,(乡镇、街道)第四级id是九位*/
    /*由于直辖市、和省层级数目不同,不方便统一处理,可以借助id是六位还是九位,进行判断然后统一处理*/
    qqmapsdk.getCityList({//获取城市列表
      success: function (ress) {
        
        console.log(ress)//城市列表全部信息
       
        num=ress.result[0][3].id//获取34个省,直辖市的id对应的id,1级行政单位(此处只是获取34中的一个)
        console.log('....1......')
        console.log(num)
        console.log(ress.result[0][0].name)
        console.log('....1-end......')
        qqmapsdk.getDistrictByCityId({
          id:num,//
          success: function (resss) {
            console.log(resss)//获取省,直辖市下辖的市(省),区(直辖市所属),2级行政单位
            console.log('....2......')
            console.log(resss.result[0][0].name)//1级行政单位(此处只是获取其中中的一个)
            console.log('....2-end......')
            num2=resss.result[0][0].id
            qqmapsdk.getDistrictByCityId({
              id: num2,//
              success: function (ressss) {
                console.log(ressss)//县级市、区(2级行政单位所属),街道(直辖市的区所属),3级行政单位
                num3 = ressss.result[0][0].id;
                console.log('....3......')
                console.log(ressss.result[0][0].fullname)//注:从三级行政单位开始,三、四级都没有name属性,只有fullname属性
                console.log(ressss.result[0][0].id)
                console.log('....3-end......')
                qqmapsdk.getDistrictByCityId({
                  id: num3,//
                  success: function (resssss) {
                    if(resssss==null){
                      console.log('false')//类似于北京市,没有四级行政,当前所在函数不执行
                    }else{//省份有四级行政单位,下面代码可以执行
                    console.log('....4......')
                    console.log(resssss)
                    console.log('....4-end......')
                    }
                  }
                })
              },
            })

          },
          
        })
      }
    })    
  },
})

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章