// 3s后,播放第二个marker,总计20秒 补充:三秒以后第一个动画就停了, 23秒以后,两个complete回调同时输出。
moveAlong多个同时进行的bug以及相关问题https://developers.weixin.qq.com/miniprogram/dev/api/media/map/MapContext.moveAlong.html moveAlong不持支同时发起多个动画,当有多个marker同时移动时,只有最后一个会动起来。尽管第一个动画已经停止了,但是当最后一个动画结束时,多个complete函数回调会同时调用。complete函数应该是动画播放完成的回调,而文档说的是接口调用成功的回调,这个说法应该是不准确的,一般开发人员理解为只要动画开始播放了就表示接口调用成功了,而非动画结束播放才算接口成功。(success和fail应该也是这样的,没有测试)。autoRotate属性设为true后,并没有根据路径方向自动调整icon角度。测试代码: // 画多条路径和marker drawPolylines (traffic) { let marker = {id:car.id, latitude:car.latitude, longitude: car.longitude} traffic.map(car => { polylines.push({ points: car.points, marker:marker // 关联路径和初始位置marker }); }) // …… } // …… // 动起来 /* this.state.traffic.map((p,i) => { console.log("Moving %d", p.marker.id); this.mapCtx.moveAlong({ markerId: p.marker.id, path: p.points, duration: 20 * 1000, }) }) */ // 测试:先播放第一个marker,总计20秒 let p = this.state.polylines[0]; this.mapCtx.moveAlong({ markerId: p.marker.id, path: p.points, autoRotate: true, duration: 20 * 1000, complete: (res) => { console.debug("move result 1: %o", res); } }) // 3s后,播放第二个marker,总计20秒 setTimeout(() => { p = this.state.polylines[1]; this.mapCtx.moveAlong({ markerId: p.marker.id, path: p.points, autoRotate: true, duration: 20 * 1000, complete: (res) => { console.debug("move result 2: %o", res); } }) }, 3000);
2021-12-10