uni-app 平移 marker 功能在 app-nvue 2.1.5+、H5、微信小程序带动画、抖音、支付宝、京东、百度、QQ小程序中的表现,但在H5中无法实现

uni-app 平移 marker 功能在 app-nvue 2.1.5+、H5、微信小程序带动画、抖音、支付宝、京东、百度、QQ小程序中的表现,但在H5中无法实现

信息项 内容
产品分类 uniapp/H5
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 windows10
HBuilderX类型 正式
HBuilderX版本号 4.24
浏览器平台 Chrome
项目创建方式 HBuilderX

示例代码:

// 创建map对象
this.mapContext = uni.createMapContext('map'); //测试轨迹  

this.mapContext.translateMarker({
markerId: 10,
destination: {
longitude: 25.040609, // 车辆即将移动到的下一个点的经度
latitude: 102.712251, // 车辆即将移动到的下一个点的纬度
},
autoRotate: true,
rotate: 20,
duration: 1000,
// 动画结束
animationEnd: function() {

    uni.showToast({  
        title: '回放完成',  
        duration: 1400,  
        icon: 'none'  
    });  
},  
fail(e) {  
    console.log(e);  
    // 轨迹回放失败回调    
},  
});

操作步骤:

// 创建map对象
this.mapContext = uni.createMapContext('map'); //测试轨迹  

this.mapContext.translateMarker({
markerId: 10,
destination: {
longitude: 25.040609, // 车辆即将移动到的下一个点的经度
latitude: 102.712251, // 车辆即将移动到的下一个点的纬度
},
autoRotate: true,
rotate: 20,
duration: 1000,
// 动画结束
animationEnd: function() {

    uni.showToast({  
        title: '回放完成',  
        duration: 1400,  
        icon: 'none'  
    });  
},  
fail(e) {  
    console.log(e);  
    // 轨迹回放失败回调    
},  
});

预期结果:

执行动画成功

实际结果:

失败了了了了 了

bug描述:

官方文档显示可以在H5支持动画translateMarker,但是运行报errMsg: ‘translateMarker:fail not found’}


更多关于uni-app 平移 marker 功能在 app-nvue 2.1.5+、H5、微信小程序带动画、抖音、支付宝、京东、百度、QQ小程序中的表现,但在H5中无法实现的实战教程也可以访问 https://www.itying.com/category-93-b0.html

19 回复

你好,刚才测试的是正常的:你再检查一下你的代码

更多关于uni-app 平移 marker 功能在 app-nvue 2.1.5+、H5、微信小程序带动画、抖音、支付宝、京东、百度、QQ小程序中的表现,但在H5中无法实现的实战教程也可以访问 https://www.itying.com/category-93-b0.html


{ “errMsg”: “translateMarker:fail maps2.LatLng is not a constructor” } 报的这个错误我在nvue可以成功执行

回复 4***@qq.com: 我这里测试的vue和nvue都没有这个错误,你能给一下你的完整代码吗?

longitude=“longitude” :markers=“marker” :polyline=“polyline”> </map> mapContext 已经在data定义 onReady() { // 创建map对象 this.mapContext = uni.createMapContext(‘map’); //测试轨迹 },

this.mapContext.translateMarker({ markerId: 10, destination: { longitude: 25.040609, // 车辆即将移动到的下一个点的经度 latitude: 102.712251, // 车辆即将移动到的下一个点的纬度 }, autoRotate: true, rotate: 20, duration: 1000, // 动画结束 animationEnd: function() {

回复 DCloud_UNI_yuhe: 是否是因为编辑器版本不一样

uni.createMapContext(‘test_map’, this) 还得穿个this

试了一样的。 如果我填一个没有定义过的ID就是报errMsg: ‘translateMarker:fail not found’ 已经有markers ID的就是errMsg: ‘translateMarker:fail maps2.LatLng is not a constructor’ nvue没有问题正常

回复 4***@qq.com: 你translateMarker是在哪里执行的

尝试运行下面的代码:

回复 DCloud_UNI_yuhe: 方法主动触发的,在生命周期自动触发都一样

回复 DCloud_UNI_yuhe: 对了测试,坐标没有移动,我换了一个坐标来测试动画,还是在原地

用你发的代码测试的情况

我知道了,是高德地图的问题,我发现这个问题了,我去看一下产生原因

回复 DCloud_UNI_yuhe: 要得我这边确实使用的高德地图,这个修复了到时候不用更新编辑器,或者用新的测试版的编辑器吧

回复 4***@qq.com: 应该是需要的,但是我可以给你一个替代方案,不用更新也可以

回复 DCloud_UNI_yuhe: 方案发给我,试试

回复 DCloud_UNI_yuhe: 对了我是要做轨迹上的marker平移

我的是在H5正常平移,打包微信小程序,无法平移知道什么原因吗?

回到顶部