在谷歌圖表中增加 svg 矩形條的寬度

Question

我正在研究 Google 時間軸圖表，每行中的條形寬度非常小。

我想增加那個酒吧的大小，但運氣不好。 使用瀏覽器的檢查元素，我可以增加大小，但是當我嘗試在我的代碼中應用相同的大小時，它不起作用。

這是我從與 SVG 相關的檢查元素部分得到的

<rect x="0" y="0" width="6000" height="40.992" stroke="none" stroke-width="0" fill="#ffffff"></rect>

以下是我的谷歌時間線圖表代碼：

<html>
            <head>
                <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['timeline']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var container = document.getElementById('timeline');
        var chart = new google.visualization.Timeline(container);
        var dataTable = new google.visualization.DataTable();

        dataTable.addColumn({ type: 'string', id: 'President' });
        dataTable.addColumn({ type: 'date', id: 'Start' });
        dataTable.addColumn({ type: 'date', id: 'End' });
        dataTable.addRows([
          [ 'Test1', new Date(1789, 3, 30), new Date(1789, 4, 01) ],
          [ 'Test2',      new Date(1789, 4, 02),  new Date(1789, 4, 03) ],
          [ 'Test3',  new Date(1789, 4, 04),  new Date(1789, 4, 06) ]]);

        chart.draw(dataTable);
      }
    </script>
  </head>
  <body>
            </head>
            <body>
                
                <div id="chart_div">
                </div>
            </body>
        </html>

誰能告訴我如何在這個谷歌圖表中增加條形或 svg 矩形的寬度。

謝謝！

Answer 1

您可以借助谷歌圖表中的選項來增加寬度，

https://developers.google.com/chart/interactive/docs/gallery/barchart

var options = {
        title: "Timeline chart",
        width: 600,
        height: 400,
        bar: {groupWidth: "95%"},
      };
        chart.draw(dataTable, options);

在谷歌圖表中增加 svg 矩形條的寬度

問題描述

1 個解決方案

解決方案1
0 2021-05-20 12:25:24

在谷歌圖表中增加 svg 矩形條的寬度

問題描述

1 個解決方案

解決方案1 0 2021-05-20 12:25:24

解決方案1
0 2021-05-20 12:25:24