更新记录

0.0.1（2022-07-18） 下载此版本

1.支持放大缩小 2.支持时间拖拽选取 3.支持监控数据信息绘制。

平台兼容性

uni-app

timeline-canvas

一个基于canvas绘制的时间轴，目前暂不支持双指缩放(微信小程序中事件touches存在返回长度的问题，导致无法准确判断事件的行为，如果有好的解决方案，可以评论区给我留言)

引入方式：

<template>
    <timeline-canvas
        :height="height"
        :width="width"
        ref="timelineCanvas"
        :timecell="timecell"
        :time="time"
        @on-time-end="changeTimeEnd"
        :is-double-touch="false"
    ></timeline-canvas>
</template>

import TimelineCanvas from '../../components/timeline-canvas/timeline-canvas.vue';

export default {
  components: {
    TimelineCanvas,
  },
  onReady() {
    uni.getSystemInfo().then(systemInfo => {
        const info = systemInfo[1]
        this.height = info.windowHeight
        this.width = info.windowWidth
    })
  },
};

参数

事件

方法