javascript - Google Chart 中的 Trippe Y 轴可视化问题

Question

我在第三个变量的 Y 轴范围上遇到问题，我尝试添加最小值、最大值、 View 范围，但由于它是百分比，并且取决于数量/价格的大小，它会越来越少可见的。任何想法或帮助将不胜感激。这是具有以下设置的图表的样子:

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>
<script>

google.charts.load('current', {
                   callback: function () {
                   var data = new google.visualization.DataTable({
                                                                 cols: [
                                                                 {label: 'Time', type: 'string', format: 'decimal'},
                                                                 {label: 'Volume', type: 'number'},
                                                                 {label: '฿', type: 'number'},
                                                                 {label: 'Buy %', type: 'number'},
                                                                 ],
                                                                 rows: [
                                                                 <?php
                                                                 while($row = mysqli_fetch_assoc($result)) {
                                                                 echo "{c:[{v: '" . $row["Timestamp"] . "'}, {v:" . $row["Volume"] . "}, {v:" . $row["LastPrice"] . "}, {v:" . $row["buyers"]*100 . "}]},";
                                                                 }
                                                                 ?>
                                                                 ]
                                                                 });

                   var container = document.getElementById('chart');
                   var formatter = new google.visualization.NumberFormat({
                                                                         fractionDigits: 8
                                                                         });
                   formatter.format(data, 2);
                   var chart = new google.visualization.LineChart(container);
                   chart.draw(data, {
                              height: 525,
                              crosshair: { trigger: 'both' },
                              series: {
                              1: {
                              targetAxisIndex: 1,
                              }
                              },
                              theme: 'material',

                              vAxes: {
                              0: {
                              title: '',
                              },
                              1: {
                              title: '',
                              },
                              2: {
                              title: '',
                              minValue: 0,
                              maxValue: 100,
                              format: '#\'%\'',
                              }
                              },

                              });

                   },
                   packages: ['corechart']
                   });

</script>

Answer 1

尝试将每个系列分配给它自己的轴...

series: {
  1: {
    targetAxisIndex: 1
  },
  2: {
    targetAxisIndex: 2
  }
}