echarts 堆叠柱状图

您好！关于ECharts堆叠柱状图的使用，我可以为您提供一些基本的指导。

首先，您需要在页面中引入ECharts库。您可以通过以下方式添加ECharts到您的HTML文件中：

<script src="https://cdn.jsdelivr.net/npm/echarts@5.2.0/dist/echarts.min.js"></script>

接下来，您需要在HTML中创建一个具有指定尺寸的DOM容器，用于呈现图表。例如：

<div id="chart-container" style="width: 600px; height: 400px;"></div>

然后，您可以使用JavaScript代码初始化并配置堆叠柱状图。以下是一个示例：

// 初始化图表实例
var chart = echarts.init(document.getElementById('chart-container'));

// 配置图表
var options = {
    title: {
        text: '堆叠柱状图示例'
    },
    tooltip: {},
    legend: {
        data: ['类别1', '类别2', '类别3']
    },
    xAxis: {
        data: ['数据1', '数据2', '数据3', '数据4', '数据5']
    },
    yAxis: {},
    series: [
        {
            name: '类别1',
            type: 'bar',
            stack: '堆叠',
            data: [120, 200, 150, 80, 70]
        },
        {
            name: '类别2',
            type: 'bar',
            stack: '堆叠',
            data: [220, 280, 190, 150, 130]
        },
        {
            name: '类别3',
            type: 'bar',
            stack: '堆叠',
            data: [320, 300, 280, 200, 180]
        }
    ]
};

// 使用配置项显示图表
chart.setOption(options);

上述代码中，我们使用了ECharts提供的配置项来定义图表的各种属性，包括标题、提示框、图例、坐标轴以及系列数据等。您可以根据自己的需求进行相应的调整。

最后，通过使用`chart.setOption(options)`将配置项应用到图表实例中，即可显示堆叠柱状图。

希望这个示例能够帮到您！如有任何问题，请随时提问。