使用Google Charts在堆叠柱状图中显示Y轴

Google Charts是一款强大的数据可视化工具，可以帮助开发人员在网页上创建各种图表，包括堆叠柱状图。堆叠柱状图是一种用于比较多个类别数据的图表类型，它将不同类别的数据堆叠在一起，以显示总体数值和各个部分的相对比例。

在使用Google Charts创建堆叠柱状图时，需要注意以下几个步骤：

引入Google Charts库：在HTML文件中引入Google Charts库的JavaScript文件，可以通过以下代码实现：

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

加载图表包：在JavaScript代码中使用google.charts.load方法加载所需的图表包，以及需要的其他依赖项。对于堆叠柱状图，需要加载corechart和bar模块，代码如下：

google.charts.load('current', {packages: ['corechart', 'bar']});

绘制图表：使用google.charts.setOnLoadCallback方法指定在Google Charts库加载完成后要执行的回调函数，在回调函数中创建数据表和图表对象，并设置相关配置。对于堆叠柱状图，需要创建一个BarChart对象，并设置isStacked属性为true，代码如下：

google.charts.setOnLoadCallback(drawChart);

function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['类别', '数值1', '数值2', '数值3'],
    ['类别1', 100, 200, 300],
    ['类别2', 150, 250, 350],
    ['类别3', 200, 300, 400]
  ]);

  var options = {
    isStacked: true,
    // 其他配置项...
  };

  var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}

在上述代码中，arrayToDataTable方法用于将数据转换为Google Charts所需的数据表格式。数据表的第一行是列名，后续行是各个类别的数据。isStacked属性设置为true表示堆叠柱状图。

显示图表：在HTML文件中创建一个<div>元素，并设置一个唯一的id，用于容纳图表。在JavaScript代码中使用document.getElementById方法获取该<div>元素，并将其作为参数传递给BarChart对象的构造函数。最后调用chart.draw方法将图表绘制到指定的<div>元素中，代码如下：