<script src="https://code.highcharts.com/gantt/highcharts-gantt.js"></script>
  <script src="https://code.highcharts.com/gantt/modules/exporting.js"></script>
  <script src="https://code.highcharts.com/gantt/modules/accessibility.js"></script>

  <!-- 容器，用于渲染图表 -->
  <div id="container"></div>
  

Highcharts.ganttChart('container', {
    title: {
        text: '职位与任期 Gantt 图'
    },
    xAxis: {
        type: 'datetime',
        tickInterval: 365 * 24 * 3600 * 1000, // 每年一个标签
        dateTimeLabelFormats: {
            year: '%Y'  // 只显示年度
        },
        gridLineWidth: 1,
        title: {
            text: '时间'
        },
        min: Date.UTC(1975, 0, 1), // 设置 X 轴的最小值
        max: Date.UTC(2015, 0, 1), // 设置 X 轴的最大值
        labels: {
            staggerLines: 1 // 确保 X 轴标签不重叠
        },
        tickPositions: [ // 指定显示的年份
            Date.UTC(1979, 0, 1),
            Date.UTC(1983, 0, 1),
            Date.UTC(1986, 0, 1),
            Date.UTC(1989, 0, 1),
            Date.UTC(1994, 0, 1),
            Date.UTC(1996, 0, 1),
            Date.UTC(2003, 0, 1),
            Date.UTC(2014, 0, 1)
        ]
    },
    yAxis: {
        uniqueNames: true,
        title: {
            text: '职位名称'
        },
        categories: ['央行行长', '财政部长', '国家总理'], // Y 轴显示的职位名称
    },
    series: [{
        name: '央行行长',
        data: [{
            name: '李葆华',
            start: Date.UTC(1979, 0, 1),
            end: Date.UTC(1983, 0, 1),
            y: 0,
            label: '1979-1983'  // 添加标签
        }, {
            name: '陈慕华',
            start: Date.UTC(1986, 0, 1),
            end: Date.UTC(1989, 0, 1),
            y: 0,
            label: '1986-1989'  // 添加标签
        }, {
            name: '朱镕基',
            start: Date.UTC(1994, 0, 1),
            end: Date.UTC(1996, 0, 1),
            y: 0,
            label: '1994-1996'  // 添加标签
        }, {
            name: '周小川',
            start: Date.UTC(2003, 0, 1),
            end: Date.UTC(2014, 0, 1),
            y: 0,
            label: '2003-2014'  // 添加标签
        }]
    }, {
        name: '财政部长',
        data: [{
            name: '张劲夫',
            start: Date.UTC(1976, 0, 1),
            end: Date.UTC(1980, 0, 1),
            y: 1,
            label: '1976-1980'  // 添加标签
        }, {
            name: '王丙乾',
            start: Date.UTC(1981, 0, 1),
            end: Date.UTC(1993, 0, 1),
            y: 1,
            label: '1981-1993'  // 添加标签
        }, {
            name: '项怀诚',
            start: Date.UTC(1999, 0, 1),
            end: Date.UTC(2004, 0, 1),
            y: 1,
            label: '1999-2004'  // 添加标签
        }, {
            name: '金人庆',
            start: Date.UTC(2004, 0, 1),
            end: Date.UTC(2008, 0, 1),
            y: 1,
            label: '2004-2008'  // 添加标签
        }]
    }, {
        name: '国家总理',
        data: [{
            name: '华国锋',
            start: Date.UTC(1977, 0, 1),
            end: Date.UTC(1981, 0, 1),
            y: 2,
            label: '1977-1981'  // 添加标签
        }, {
            name: '李鹏',
            start: Date.UTC(1988, 0, 1),
            end: Date.UTC(1999, 0, 1),
            y: 2,
            label: '1988-1999'  // 添加标签
        }, {
            name: '温家宝',
            start: Date.UTC(2004, 0, 1),
            end: Date.UTC(2014, 0, 1),
            y: 2,
            label: '2004-2014'  // 添加标签
        }]
    }],
    tooltip: {
        formatter: function () {
            return '<b>' + this.point.name + '</b><br/>' + this.point.label; // 显示任职日期
        }
    }
});