Vue 甘特图 gantt 安装使用（dhtmlx-gantt）

首先，确保你已经安装了Vue和dhtmlx-gantt。如果没有安装，可以使用npm或yarn进行安装：

npm install vue dhtmlx-gantt
# 或者
yarn add vue dhtmlx-gantt

然后，你可以在Vue组件中使用dhtmlx-gantt。以下是一个简单的示例：

<template>
  <div>
    <div id="gantt_here" style="width: 100%; height: 600px;"></div>
  </div>
</template>
 
<script>
import "dhtmlx-gantt";
import "dhtmlx-gantt/codebase/dhtmlxgantt.css";
 
export default {
  name: "GanttChart",
  mounted() {
    this.initializeGantt();
  },
  methods: {
    initializeGantt() {
      dhtmlx.gantt.init(document.getElementById("gantt_here"));
      dhtmlx.gantt.setScale("day");
      dhtmlx.gantt.parse([
        {
          id: 1,
          text: "Project #1",
          start_date: "2020-04-01",
          duration: 10,
          progress: 0.6
        }
      ]);
    }
  }
};
</script>

在这个示例中，我们在Vue组件的mounted钩子中初始化了甘特图，并设置了时间尺度为天。然后，我们使用dhtmlx.gantt.parse方法来解析并显示一个示例任务。你可以根据需要添加更多的数据和功能。