• 小程序之地图标注以及导航


    简单说一下遇到的问题,标注点出不来情况,之后是.wxml文件中map标签行内定义longitude="{{map.lng}}" 、latitude="{{map.lat}}"、markers="{{map.markers}}"然后在.js文件中也分别定义。

    .wxml文件

    <view class='wc_area_mapbox'>
         <map class='wc_area_map' bindtap='location' bindmarkertap='location' show-location longitude="{{map.lng}}" latitude="{{map.lat}}" markers="{{map.markers}}"></map>
    </view>

    .js文件

    const app = getApp();
    Page({
        data: {
            map:{
                lat:0,         //这里必须定义lat,lng,不然标注点出不来
                lng:0,
                markers:[],
                navigation:null
            },
            service_detail: [],
            wc_id:null,
            
        },
    
        onLoad: function (options) {
            var that = this;
            that.setData({
                wc_id: options.id
            })
            that.get_wc_detail();
        },
        get_wc_detail: function () {
            var that=this;
            wx.showLoading({
                title: '加载中',
            })
            wx.request({
                url: app.globalData.url + 'index.php/api/Home/service_detail',
                data:{
                    id: that.data.wc_id,
                    lng: app.globalData.location.longitude,
                    lat: app.globalData.location.latitude
                },
                success:function(res){
                    console.log(res)
                    wx.hideLoading();
                    if(res.data.status==200){
                        that.setData({
                            navigation: res.data.data.name,
                            service_detail: res.data.data,
                            'map.lat': res.data.data.lat,
                            'map.lng':res.data.data.lng,
                            'map.markers':[{
                                latitude: res.data.data.lat,     //这里也定义
                                longitude: res.data.data.lng,
                                name: res.data.data.title
                            }]
                        })
                        wx.setNavigationBarTitle({
                            title: that.data.navigation
                        })  
                    }else{
                        wx.showToast({
                            title: res.data.error,
                            icon:'loading',
                            duration:1000
                        })
                    }
                },
                fail:function(){
                    wx.hideLoading();
                    wx.showToast({
                        title: '请求失败',
                        icon:'loading',
                        duration:1000
                    })
                }
            })
        },
        location:function(){
            wx.openLocation({                    //调用导航
                latitude: this.data.map.lat,
                longitude: this.data.map.lng,
                name: this.data.navigation,
                scale: 28
            })
        }
    })
  • 相关阅读:
    设定cookie 获取cookie数据的转换
    cookie cookie的获取
    常见的请求方式 json字符串
    请求报文和响应报文
    http协议
    php分页查询 子查询
    MAC 地址为什么不需要全球唯一
    ceph分布式存储简介
    一文看懂为什么边缘计算是大势所趋
    真香!Windows 可直接运行 Linux 了
  • 原文地址:https://www.cnblogs.com/wanan-01/p/9078059.html
Copyright © 2020-2023  润新知