如何移除Google Charts折线图底部图例并保留左侧图例？

你看到的底部“图例”其实不是图例——legend: 'none'已经生效了，底部显示的是Y轴的标题（就是你定义数据列时写的'value'）。要隐藏它，只需在图表配置里添加垂直轴（vAxis）的标题设置：

修改后的关键配置 #

在chart.draw的配置对象中新增：

vAxis: {
  title: ''  // 清空Y轴标题，隐藏底部文本
}

完整修改后的代码 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {
    'packages': ['corechart']
  });
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {
    var jsonData = $.ajax({
      url: "prices.json",
      dataType: "json",
      async: false
    }).responseJSON;
    var key = "prices";
    var ar = Object.entries(jsonData["prices"]).map(([a, b]) => [new Date(b[0]).toLocaleDateString("en-US"), b[1]]);
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'date');
    data.addColumn('number', 'value');
    data.addRows(ar);
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
    chart.draw(data, {
      title: 'International Wine Sales',
      backgroundColor: 'transparent',
      colors: ['#00d1b2'],
      legend: 'none',
      vAxis: {
        title: ''  // 新增：清空Y轴标题
      }
    });
  }
</script>
<div id="chart_div" style="width: 100%; height: 100%"></div>

补充说明 #

• 左侧的轴刻度会正常保留，仅移除底部的轴标题文本
• 若后续添加多数据系列，可通过legend: {position: 'left'}配置显示左侧图例，同时用legend: 'none'完全隐藏图例

内容的提问来源于stack exchange，提问作者dss