收藏
回答

map组件加上include-points属性后,安卓上map组件无法正常显示

框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
小程序 Bug map 客户端 Android 6.6.7 2.1.2

手机型号:HUAWEi P9    Android版本:7.0

手机型号:红米note3     Android版本:5.0.2

map组件加了include-points属性后安卓地图无法正常显示,工具和ios正常显示,安卓显示如下:



ios显示正常:如下


代码片段:wxml

<map
     id="myMap"
     style="width: 100%; height: {{scrollHeight}}rpx"
     latitude="{{latitude}}"
     longitude="{{longitude}}"
     markers="{{markers}}"
     include-points="{{includePoints}}"
     show-location
     bindmarkertap="chooseShopByMarket"
     bindregionchange="regionChange"
     bindtap="tap"
   ></map>
代码片段:js

// pages/user/location.js
var util = require('../../utils/util.js')
var page = require('../../utils/page.js')
var app = getApp();
Page({
  data: {
    latitude: 0,
    longitude: 0,
    markers:null,
    scrollHeight:0,
    showMap:false,
    includePoints:null,
    shopList:[],
    listBoxShow:false,
    regionChangeLock:false
  },
  onLoad:function(){
    var that = this;
    wx.getLocation({
      type: 'wgs84',
      success: function (res) {
        that.setData({
          latitude:res.latitude,
          longitude:res.longitude
        })
        that.getAroundShop();
      }})
 
  },
  onReady: function (e) {
    this.setData({
      scrollHeight: app.globalData.useableHeight,
    })
    this.mapCtx = wx.createMapContext('myMap');
  },
  getAroundShop:function(){
    setTimeout(()=>{
      setTimeout(()=>{
        this.data.regionChangeLock = true;
      },1000)
 
      this.setData({
        showMap:true,
        listBoxShow:true,
        markers:[
          {
            id: 1,
            latitude: 29.55314,
            longitude: 106.5775,
            title: '创意园1',
            callout:{
              content:'大坪英利店\n(大坪英利店大融城)',
              fontSize:12,
              color:'#ffffff',
              bgColor:'#121C32',
              display:'BYCLICK',
              padding:4,
              borderRadius:5,
              textAlign:'left'
            },
            iconPath:'../../assets/images/shopcarLogo_fixed.png',
            width:40,
            height:40
          },
          {
            id: 2,
            latitude: 29.55314,
            longitude: 106.5867,
            name: '创意园1',
            callout:{
              content:'2',
              fontSize:12,
              color:'#ffffff',
              bgColor:'#121C32',
              display:'BYCLICK',
              padding:4,
              borderRadius:5,
              textAlign:'center'
            },
            iconPath:'../../assets/images/shopcarLogo_fixed.png',
            width:40,
            height:40
          },
          {
            id: 3,
            latitude: 29.55314,
            longitude: 106.5594,
            name: '创意园1',
            callout:{
              content:'3',
              fontSize:12,
              color:'#ffffff',
              bgColor:'#121C32',
              display:'BYCLICK',
              padding:4,
              borderRadius:5,
              textAlign:'center'
            },
            iconPath:'../../assets/images/shopcarLogo_fixed.png',
            width:40,
            height:40
          },
          {
            id: 4,
            latitude: 29.55314,
            longitude: 106.5458,
            name: '创意园1',
            callout:{
              content:'4',
              fontSize:12,
              color:'#ffffff',
              bgColor:'#121C32',
              display:'BYCLICK',
              padding:4,
              borderRadius:5,
              textAlign:'center'
            },
            iconPath:'../../assets/images/shopcarLogo_fixed.png',
            width:40,
            height:40
          },
          {
            id: 5,
            latitude: 29.55314,
            longitude: 106.5358,
            name: '创意园1',
            callout:{
              content:'5',
              fontSize:12,
              color:'#ffffff',
              bgColor:'#121C32',
              display:'BYCLICK',
              padding:4,
              borderRadius:5,
              textAlign:'center'
            },
            iconPath:'../../assets/images/shopcarLogo_fixed.png',
            width:40,
            height:40
          },
        ],
        includePoints:[
          {
            latitude: this.data.latitude,
            longitude: this.data.longitude,
          },
          {
            latitude: 29.55314,
            longitude: 106.5775,
          },
          {
            latitude: 29.55314,
            longitude: 106.5867,
          },
          {
            latitude: 29.55314,
            longitude: 106.5594,
          },
          {
            latitude: 29.55314,
            longitude: 106.5458,
          },
          {
            latitude: 29.55314,
            longitude: 106.5358,
          }
        ],
        shopList:[
          {
            name:'优点24h便利店(时代天街店)',
            address:'重庆市渝中区大坪龙湖时代天街',
            distance:'780m',
            shop_id:144
          },
          {
            name:'优点24h便利店(时代天街店)',
            address:'重庆市渝中区大坪龙湖时代天街',
            distance:'780m',
            shop_id:144
          },
          {
            name:'优点24h便利店(时代天街店)',
            address:'重庆市渝中区大坪龙湖时代天街',
            distance:'780m',
            shop_id:144
          },
          {
            name:'优点24h便利店(时代天街店)',
            address:'重庆市渝中区大坪龙湖时代天街',
            distance:'780m',
            shop_id:144
          },
          {
            name:'优点24h便利店(时代天街店)',
            address:'重庆市渝中区大坪龙湖时代天街',
            distance:'780m',
            shop_id:144
          }
        ]
      })
    },2000)
  },
  getCenterLocation: function () {
    this.mapCtx.getCenterLocation({
      success: function(res){
        console.log(res.longitude)
        console.log(res.latitude)
      }
    })
  },
  moveToLocation: function () {
    this.mapCtx.moveToLocation()
  },
  translateMarker: function() {
    this.mapCtx.translateMarker({
      markerId: 1,
      autoRotate: true,
      duration: 1000,
      destination: {
        latitude:23.10229,
        longitude:113.3345211,
      },
      animationEnd() {
        console.log('animation end')
      }
    })
  },
  includePoints: function() {
    this.mapCtx.includePoints({
      padding: [10],
      points: [{
        latitude:23.10229,
        longitude:113.3345211,
      }, {
        latitude:23.00229,
        longitude:113.3345211,
      }]
    })
  },
  toggleListBox:function () {
    this.setData({
      listBoxShow:!this.data.listBoxShow
    })
  },
  chooseShop:function (shop_id) {
    return false;
    if(app.globalData.shop.shop_id!==shop_id){
      app.globalData.shop = null;
      app.globalData.target_shop_id = shop_id;
      app.globalData.categories = null;
    }
    wx.switchTab({
      url: '/pages/index/index'
    })
  },
  chooseShopByMarket:function (e) {
    let shop_id = e.markerId;
    this.chooseShop(shop_id);
  },
  chooseShopByList:function (e) {
    let shop_id = e.currentTarget.dataset.id;
    this.chooseShop(shop_id);
  },
  regionChange:function () {
    if(!this.data.regionChangeLock) return;
    this.data.listBoxShow&&this.setData({
      listBoxShow:false
    })
  },
  tap:function () {
    if(!this.data.regionChangeLock) return;
    this.data.listBoxShow&&this.setData({
      listBoxShow:false
    })
  }
})

我的微信号:hhd534634672

回答关注问题邀请回答
收藏

3 个回答

  • 艺
    2019-12-01


    include-points这个属性是不是没有用了呀


    2019-12-01
    有用
    回复
  • 远山
    远山
    2018-07-05

    代码片段:wechatide://minicode/GLQv1Fm874LI

    2018-07-05
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-07-04

    麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题

    2018-07-04
    有用
    回复 10
    • 远山
      远山
      2018-07-05

      wechatide://minicode/GLQv1Fm874LI

      2018-07-05
      回复
    • 远山
      远山
      2018-07-06回复远山

      官方能不能了解一下

      2018-07-06
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2018-07-09回复远山

      你好,经测试,未能复现问题,在荣耀9跟华为P9都能正常显示

      2018-07-09
      回复
    • mangoJuice
      mangoJuice
      2018-08-25回复疯狂的小辣椒

      他默认设置的lat,lng都是0,在大西洋的某个点上。在那个缩放等级下是一片空白的,经过缩放是可以看到地图的。但是存在的问题是,这个includePoints方法,它会缩放视野展示所有的点,但是在手机上很多时候会一闪而过,然后飘到默认的设置的lat,lng这个点上,如果这位朋友不设置默认的经纬度,他就会飘到北京的某个地方。includePoints和include-points="{{includePoints}}"这个属性其实是异曲同工,因为我测试了,用这两个都会出现类似的问题,当然我指的是在真机上。所以还请官方能认真解决这个问题。

      2018-08-25
      回复
    • mangoJuice
      mangoJuice
      2018-08-25回复疯狂的小辣椒

      就是这个问题,我在小米note3(安卓版本7.1.1),vivo X9(7.1.2)。应该是安卓基带版本在7.0以上的都有这个问题吧。

      2018-08-25
      回复
    查看更多(5)
登录 后发表内容