Google Visualization Gauge 仪表盘标签移至上方后被截断的解决方法咨询

我正尝试把Google仪表盘（Gauge）的标签移到可视化图表的上方，我试了用$("#Min svg text:first").attr("y", 5);来调整，但结果标签顶部被截断了。我已经试着研究了SVG的结构，但所有尝试都没能在仪表盘上方添加内边距/外边距。

有没有人有相关建议或者经验？非常感谢！

相关代码 #

JavaScript 代码

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

const paramsMin = {
  divId: "Min",
  label: "Fastest",
  value: 3,
  greenFrom: 3,
  greenTo: 5,
}
google.charts.setOnLoadCallback(function() {
  drawChart(paramsMin)
});

const paramsStandard = {
  divId: "Standard",
  label: "Standard",
  value: 5,
}
google.charts.setOnLoadCallback(function() {
  drawChart(paramsStandard)
});

const paramsMax = {
  divId: "Max",
  label: "Slowest",
  value: 7,
  redFrom: 5,
  redTo: 7,
}
google.charts.setOnLoadCallback(function() {
  drawChart(paramsMax)
});

function drawChart(params) {
  const {
    divId,
    label,
    value,
    greenFrom = null,
    greenTo = null,
    redFrom = null,
    redTo = null
  } = params;

  var data = google.visualization.arrayToDataTable([
    ['Label', 'Value'],
    [label, value],
  ]);

  var options = {
    width: 120,
    height: 120,
    greenFrom: greenFrom,
    greenTo: greenTo,
    redFrom: redFrom,
    redTo: redTo,
    minorTicks: 5,
    min: 0,
    max: 10,
  };

  var chart = new google.visualization.Gauge(document.getElementById(`${divId}`));

  chart.draw(data, options);
  $(`#${divId} svg text:first`).attr('y', 5);
}

CSS 代码

.grid-container-element {
  display: grid;
  grid-template-columns: 125px 125px 125px;
}

.grid-child-element {}

HTML 代码

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>


<div class="grid-container-element">
  <div class="grid-child-element purple">
    <div id="Min" style="width: 120px; height: 120px;"></div>
  </div>
  <div class="grid-child-element green">
    <div id="Standard" style="width: 120px; height: 120px;"></div>
  </div>
  <div class="grid-child-element green">
    <div id="Max" style="width: 120px; height: 120px;"></div>
  </div>
</div>

备注：内容来源于stack exchange，提问作者cmill