taro开发微信小程序-播放轨迹(十一)

taro集成了地图后如何实现轨迹播放,暂停,停止呢？本身地图并不具备轨迹播放的能力，但是基于地图api可以实现轨迹播放的效果

思路如下：

1.获取所有的轨迹坐标点-最好是数组格式的json

2.定义一个定时任务 动态将数组传递给wxml的polyline

3.定义三个按钮来触发定时任务

实现过程如下：

<Map polyline={{polyline}}></Map>

construcure(){
    this.timer = null;
    this.polyline ={ points:[] };
    this._polyline =[{},{},{}];//查询的坐标集合
    this.speed=1000;
}
start(){
    if(this.timer){
        return false;
    }
    let speed = this.speed;
    let _this =this
    this.timer = setInterval(function(){
      //将 _polyline push 到 polyline的points 注意this对象 也可以使用es6 =>
        _this.setState({
            polyline:_polyline
        })
    },speed)
}
pause(){
    //对比polyline.points  _polyline的长度 将剩余的项push到polyline.points
    this.setState({
        polyline:_polyline
    })
}
stop(){
    //清除定时器
    clearInterval(this.timer);
    _this.setState({
            timer:null,
            _polyline:[]
        })
}

taro开发微信小程序-初始化项目(一)

taro开发微信小程序-了解项目结构(二)

taro开发微信小程序-使用Taro ui(三)

taro开发微信小程序-路由传参(四)

taro开发微信小程序-页面开发规范(五)

taro开发微信小程序-配置tab页面(六)

taro开发微信小程序-使用websocket(七)

taro开发微信小程序-网络请求(八)

taro开发微信小程序-解决编译报错Error: EISDIR: illegal operation on a directory（九）

taro开发微信小程序-加载腾讯地图(十)

taro开发微信小程序-播放轨迹(十一)

taro开发微信小程序-在地图页面添加搜索框(十二)

taro开发微信小程序-列表下拉刷新,上拉加载(十三)

taro开发微信小程序-添加开发者预览,上传测试版本(十四)

taro开发微信小程序-数据共享于缓存使用Redux(十五)

errMsg:getLocation:fail:require permission desc-小程序无法定位[解决](十六)