zoukankan      html  css  js  c++  java
  • 小程序之地图标注以及导航

    简单说一下遇到的问题,标注点出不来情况,之后是.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
            })
        }
    })
  • 相关阅读:
    javaWeb总结——session
    javaWeb中servlet开发——过滤器
    参数化测试
    JUnit 4中元数据的用法
    appium常用方法
    appium查看控件的方法
    appium+java+testng+maven环境搭建
    java-appium自动化测试之DesiredCapabilities
    GitHub 标星 15.3k,Java 编程思想最新中文版(On Java 8)
    【成功上岸】2年半开发经验进入梦寐以求的京东上班,附上我的上岸经验希望帮助到大家!
  • 原文地址:https://www.cnblogs.com/wanan-01/p/9078059.html
Copyright © 2011-2022 走看看