个人中心 | 微信开放社区

安卓机调取地图缩放闪退问题

<view class='main'> <view class='search'> <view class='bg'> <image class='icon' src='/images/icon_search.png'></image> <input bindinput="bindKeyInput" bindconfirm="search" class='input' placeholder='关键字/区域/商圈'></input> </view> <image class='nav' src='/images/nav_right_map.png' bindtap='goTo'></image> </view> <map id='myMap' class='map' longitude="{{map.longitude}}" latitude="{{map.latitude}}" markers="{{markers}}" controls="{{controls}}" bindcontroltap="controltap" show-location include-points="{{includes}}" bindcallouttap="selectStore" bindmarkertap="selectStore" bindregionchange="getCenterLocation" scale='13' bindtap="includePoints" scale="18"></map> <view class='store' bindtap='openDetail' data-id="{{detail.StoreId}}"> <view class='sw nowrap'>{{detail.StoreName}}</view> <view class='seat sw nowrap'>{{detail.Address}}</view> <view class='now' wx:if="{{detail.Distance}}"><image class='jl' src='/images/icon_juli.png'></image>距离当前位置{{detail.Distance}}</view> <image class='left' src='/images/icon_left.png'></image> </view> <scroll-view class='scroll' scroll-y> <view class='list' wx:for="{{list}}" wx:key="{{item.RoomTypeId}}" bindtap='openRoom' data-id="{{item.RoomTypeId}}"> <image class='img' src="{{item.RoomTypeImage}}" mode="aspectFill"></image> <view> <view>{{item.RoomTypeName}}</view> <view>￥{{item.Price}}起/月</view> </view> </view> </scroll-view> </view> // pages/map/map.js const app = getApp() var QQMapWX = require('../../libs/qqmap-wx-jssdk.min.js'); // 实例化API核心类 var qMap = new QQMapWX({ key: 'AOCBZ-UZFKF-FFVJR-JI5R3-PXP5J-I2F5K' // 必填 }); let w = 0; let h = 0; let Marr = []; let Parr = []; let isSF=true; let data = { "CommonParam": { "Phone": "", "CityName": "", "PriceType": -1, "PageSize": 5, "PageIndex": 1 }, "Priority1SearchText": '', "Priority3LongAndLati": { "Longitude": 360, "Latitude": 360, "ForSearch": 1 } } Page({ /** * 页面的初始数据 */ data: { map: { longitude: '',//中心经度 latitude: '',//中心纬度 }, markers: [],//坐标点 controls: [],//控件 includes: [],//包含点 detail: null,//门店详情 list: [],//房型列表 Data:null, }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { isSF = true wx.getSystemInfo({ success: function (res) { w = res.windowWidth h = res.windowHeight } }) let that = this; wx.getLocation({ type: 'gcj02', success: function (res) { let control = [{ id: 1, iconPath: '/images/wz.png', position: { left: (w - 72) - 10, top: (h * 0.45 - 25) - 15, width: 72, height: 25 }, clickable: true }]; data.Priority3LongAndLati.Longitude = res.longitude data.Priority3LongAndLati.Latitude = res.latitude data.CommonParam.CityName = app.globalData.currentCity // data.Priority3LongAndLati.Longitude = '121.389' // data.Priority3LongAndLati.Latitude = '31.185' that.search(); that.setData({ 'map.longitude': res.longitude, 'map.latitude': res.latitude, // 'map.longitude': '121.389', // 'map.latitude': '31.185', controls: control }) } }) // 使用 wx.createMapContext 获取 map 上下文 this.mapCtx = wx.createMapContext('myMap') }, controltap(e) { console.log(e.controlId) let that = this; if (e.controlId == 1) { wx.getLocation({ type: 'gcj02', success: function (res) { that.setData({ 'map.longitude': res.longitude, 'map.latitude': res.latitude, }) } }) } }, includePoints: function () { this.mapCtx.includePoints({ padding: [10], points: [{ latitude: 23.10229, longitude: 113.3345211, }, { latitude: 23.00229, longitude: 113.3345211, }] }) }, goTo: (event) => { wx.navigateBack({ url: event.currentTarget.dataset.url }) }, search: function () { let user = wx.getStorageSync('MFUser'); if (user) { data.CommonParam.Phone = user.PhoneNumber } if (isSF){ wx.showLoading({ title: '加载中', mask: true }) } let _this = this; Marr=[] Parr=[] wx.request({ url: app.globalData.url.concat('/api/Search/SearchStore'), method: 'POST', data: data, success: function (res) { console.log(res.data) data.Priority1SearchText='' let d = res.data.Data; if (d.length){ if(isSF){ _this.setData({ detail: d[0], }) _this.getStoreList(d[0].StoreId) } _this.setData({ Data: res.data.Data }) for (let i = 0; i < d.length; i++) { let value = wx.getStorageSync(d[i].Lat + ',' + d[i].Lng) if (value) { _this.pushMarker(value.lat, value.lng, d, i); } else { _this.reverseLocation(d[i].Lat, d[i].Lng, d, i) } } } }, complete: function () { wx.hideLoading(); isSF = false; } }) }, reverseLocation: function (lat, lng, data, i) {//百度坐标转腾讯地图坐标 var that = this; // 调用接口 qMap.reverseGeocoder({ location: { latitude: lat, longitude: lng, }, coord_type: 3,//baidu经纬度 success: function (res) { var location = res.result.ad_info.location; that.pushMarker(location.lat, location.lng, data, i); wx.setStorage({ key: lat + ',' + lng, data: { lat: location.lat, lng: location.lng } }) } }); }, pushMarker: function (lat, lng, d, i) { let _this = this; let color ='#000' if(isSF){ color = (i == 0) ? '#FF5B5B' : '#000' } //添加marker点 let m = { iconPath: "/images/icon_sign_dizhi.png", id: d[i].StoreId, latitude: lat, longitude: lng, width: 19, height: 19, callout: { content: d[i].StoreName + '\n￥' + d[i].StartPrice + '起/月', fontSize: 12, borderRadius: 8, bgColor: "#ffffff", color: color, padding: 5, display: 'ALWAYS' } } Marr.push(m) //添加包含点，缩放地图展示 let p = { latitude: d[i].Lat, longitude: d[i].Lng, } Parr.push(p) if (isSF){ _this.setData({ includes: Parr }) } _this.setData({ markers: Marr, }) }, //获取房型列表 getStoreList:function(id){ let _this=this; wx.request({ url: app.globalData.url.concat('/api/StoreBrand/RoomTypes'), method: 'POST', data: { "StoreId": id }, success: function (res) { _this.setData({ list:res.data.Data }) } }) }, selectStore:function(e){ for (let i in this.data.Data){ if (this.data.Data[i].StoreId == e.markerId){ this.setData({ detail: this.data.Data[i] }) } } let m = this.data.markers for (let i in m){ if (m[i].id == e.markerId){ m[i].callout.color ='#FF5B5B' }else{ m[i].callout.color = '#000' } } this.setData({ markers:m }) this.getStoreList(e.markerId) }, openDetail: (args) => { wx.navigateTo({ url: '../storeDetail/storeDetail?id=' + args.currentTarget.dataset.id }) }, openRoom:(args)=>{ wx.navigateTo({ url: '../RoomDetail/RoomDetail?RoomTypeId=' + args.currentTarget.dataset.id }) }, bindKeyInput: function (e) { data.Priority1SearchText = e.detail.value }, onReady:function(){ wx.getSetting({ success: res => { if (!res.authSetting['scope.userLocation']) { wx.authorize({ scope: 'scope.userLocation', success() { } }) }} }) }, //显示门店信息 getCenterLocation: function (e) { let _this = this; if (e.type == 'begin') { this.mapCtx.getCenterLocation({ success: function (res) { data.Priority3LongAndLati.Longitude = res.longitude data.Priority3LongAndLati.Latitude = res.latitude _this.search(); } }) } } })

GitHub账号

选择需要上架的开放服务

案例类型