武装少女在线观看高清完整版免费,丝袜+亚洲区,少妇被cao高潮呻吟声,午夜伦情电午夜伦情电影,日日躁夜夜躁狠狠躁

小程序模板網(wǎng)

微信小程序中使用騰訊地圖sdk

發(fā)布時(shí)間:2018-04-13 15:00 所屬欄目:小程序開發(fā)教程

近期在做一款彩票服務(wù)類項(xiàng)目中用到了騰訊地圖提供的小程序解決方案,拿來給大家分享一下!
  使用起來非常簡單,就是一些功能還有待完善。
  官方文檔:http://lbs.qq.com/qqmap_wx_jssdk/index.html

步驟:

  1. 申請(qǐng)開發(fā)者密鑰(key):申請(qǐng)密匙
  2. 下載微信小程序JavaScriptSDK,微信小程序JavaScriptSDK v1.0
  3. 安全域名設(shè)置,需要在微信公眾平臺(tái)添加域名地址https://apis.map.qq.com
  4. 小程序示例

    // 引入SDK核心類
    var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
    var qqmapsdk;
    Page({
     onLoad: function () {
         // 實(shí)例化API核心類
         qqmapsdk = new QQMapWX({
             key: '申請(qǐng)的key'
         });
     },
     onShow: function () {
         // 調(diào)用接口
         qqmapsdk.search({
             keyword: '彩票',
             success: function (res) {
                 console.log(res);
             },
             fail: function (res) {
                 console.log(res);
             },
         complete: function (res) {
             console.log(res);
         }
     });
    })

    結(jié)果效果圖:

  5. 核心類
    5.1 地點(diǎn)搜索search(options:Object)
    通過關(guān)鍵詞keyword搜索周邊poi,比如“酒店”“餐飲”“娛樂”“學(xué)校”等
    去購彩界面的實(shí)現(xiàn):
    5.1.1 buy.js

    // 引入騰訊地圖SDK核心類
    var QQMapWX = require('../../utils/qqmap-wx-jssdk.js');
    var util = require("../../utils/util.js");
    var qqmapsdk;
    Page({
     data: {
      resData: []
     },
     onLoad: function (options) {
      // 實(shí)例化騰訊地圖API核心類
      qqmapsdk = new QQMapWX({
       key: 'HPNBZ-B426V-CZQPP-UN4R6-QYOF2-MYFU3'//此處使用你自己申請(qǐng)的key
      });
     },
     onShow: function () {
      var that = this;
      // 騰訊地圖調(diào)用接口
      qqmapsdk.search({
       keyword: '彩票',
       page_size: 20,
       success: function (res) {
        console.log(res);
        var resData = res.data;
        for (var i = 0; i < resData.length; i++) {
         resData[i]._distance = util.formatDistance(resData[i]._distance);//轉(zhuǎn)換一下距離的格式
        }
        that.setData({resData: resData});
       },
       fail: function(res) {
        console.log(res);
       },
       complete: function(res) {
        console.log(res);
       }
      })
     }
    })
    // utils/util.js
    /**
    * 將距離格式化
    * <1000m時(shí) 取整,沒有小數(shù)點(diǎn)
    * >1000m時(shí) 單位取km,一位小數(shù)點(diǎn) 
    */
    function formatDistance(num) {
     if (num < 1000) {
      return num.toFixed(0) + 'm';
     } else if (num > 1000) {
      return (num / 1000).toFixed(1) + 'km';
     }
    }

    5.1.2 buy.wxml 主要樣式采用weui

    <view class="page">
    <view wx:for="{{resData}}" wx:key="shop" class="page__bd">
     <view bindtap="navTo" data-item="{{item}}">
       <view class="weui-panel">
         <view class="weui-panel__bd">
           <view class="weui-media-box weui-media-box_text">
             <view class="weui-media-box__title weui-media-box__title_in-text">{{item.title}}</view>
             <view class="weui-media-box__desc">{{item.address}}</view>
             <view class="weui-media-box__info">
               <view class="weui-media-box__info__meta">電話:{{item.tel}}</view>
               <view class="weui-media-box__info__meta weui-media-box__info__meta_extra">距離:{{item._distance}}</view>
             </view>
           </view>
         </view>
       </view>
     </view>
    </view>
    </view>

    5.2 關(guān)鍵詞輸入提示getSuggestion(options:Object)
    用于獲取輸入關(guān)鍵字的補(bǔ)完與提示,幫助用戶快速輸入。
    示例:

    // 調(diào)用接口
    qqmapsdk.getSuggestion({
     keyword: '技術(shù)',
     success: function(res) {
         console.log(res); 
     },
     fail: function(res) {
         console.log(res);
     },
     complete: function(res) {
         console.log(res);
     }
    });

    5.3 距離計(jì)算calculateDistance(options:Object)
    計(jì)算一個(gè)點(diǎn)到多點(diǎn)的步行、駕車距離。
    示例:

    // 調(diào)用接口
    qqmapsdk.calculateDistance({
     mode: 'walking';//步行,駕車為'driving'
     to:[{
         latitude: 39.984060,
         longitude: 116.307520
     }, {
         latitude: 39.984572,
         longitude: 116.306339
     }],
     success: function(res) {
         console.log(res);
     },
     fail: function(res) {
         console.log(res);
     },
     complete: function(res) {
         console.log(res);
     }
    });

    5.4 另外還有以下功能,就不一一演示了。

    • getCityList(options:Object):獲取全國城市列表數(shù)據(jù);
    • getDistrictByCityId(options:Object):通過城市ID返回城市下的區(qū)縣;
    • reverseGeocoder(options:Object):用于獲取輸入關(guān)鍵字的補(bǔ)完與提示,幫助用戶快速輸入
    • geocoder(options:Object):提供由地址描述到所述位置坐標(biāo)的轉(zhuǎn)換,與逆地址解析reverseGeocoder()的過程正好相反。


本文地址:http://www.kknew.com.cn/wxmini/doc/course/23350.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢: 點(diǎn)擊咨詢
在線客服
易小優(yōu)
轉(zhuǎn)人工 ×