# 基于vue3的可拖拽甘特图

**Repository Path**: firechildren/qiu-gantt-for-v3

## Basic Information

- **Project Name**: 基于vue3的可拖拽甘特图
- **Description**: 用vue3开发的可拖拽甘特图
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2024-08-01
- **Last Updated**: 2025-08-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 可拖拽甘特图vue3版本

#### 介绍

采用vue3纯手工
在y轴以及x轴上均添加了虚拟列表，不管有多少万条数据，在页面上只渲染肉眼可以看见的元素（详见下图），解决数据过多时候页面卡顿问题

![输入图片说明](intr/intr05.jpg)

### 对比上一代

从框架性能角度：vue3先天比vue2性能要好。

从功能性能角度：对防重叠算法进行了重构，对比上一代甘特图模版，另外增加了X轴的虚拟列表。

从功能角度：该vue3版本的甘特图模版，还增加了多层级右键菜单的功能、置顶功能、比例缩放等功能

从易上手角度：该版本将模版组件化，开箱即用，降低使用成本

#### 项目截图

![拖拽](intr/intr01.jpg)

![置顶](intr/intr02.jpg)

![右键菜单](intr/intr03.jpg)

![等比例缩放](intr/intr06.jpg)