vue中利用dhtmlx-gantt实现甘特图
在Vue中使用dhtmlx-gantt来实现甘特图，首先需要安装dhtmlx-gantt库：
npm install dhtmlx-gantt然后在Vue组件中引入并使用：
<template>
<div id="gantt_here" style="width: 100%; height: 600px;"></div>
</template>
<script>
import { gantt } from "dhtmlx-gantt";
export default {
name: "GanttChart",
mounted() {
gantt.init(this.$el);
gantt.parse([
// 定义你的任务数据
{ id: 1, text: "任务1", start_date: "2023-04-01", duration: 5 },
// 更多任务...
]);
}
};
</script>
<style>
/* 你可以添加自己的样式 */
</style>这段代码创建了一个Vue组件，该组件在被挂载到DOM后初始化dhtmlx-gantt甘特图，并加载了一些示例数据。你需要替换gantt.parse方法中的数据为你的实际数据。
评论已关闭