2017-02-20 65 views
0

嗨,大家好,我已經找到了四處尋找如何做到這一點即使在谷歌文檔上花了幾個小時,不知道如果我谷歌搜索非常或什麼。 簡單的問題,我有這個柱形圖,它會根據我的數據庫上的數據顯示隨機數的酒吧,但我想,如果它超過5或大於一個大小例如給我一個滾動條 基本上我想要的是字體大小和圖表中列的寬度保持相同的大小,無論我多少人有,但它們全部用滾動條 出現下圖的代碼,我和我的嘗試波紋管:谷歌圖表上的滾動條

let chart = new google.visualization.ColumnChart(document.getElementById("detailedCharts")); 

    const options = { 
     title: "Issues per Company for category", 
     width: "1000", 
     height: "500", 
     hAxis: { 
      title: "Company Name" 
      }, 
     vAxis: { 
      title: "Issue Count" 
     } 
    }; 

    chart.draw(dataTable, options); 
} 

我試圖強迫它只顯示5,希望它能像這樣自己顯示滾動條

let chart = new google.visualization.ColumnChart(document.getElementById("detailedCharts")); 

    const options = { 
     title: "Issues per Company for category", 
     width: "1000", 
     height: "500", 
     hAxis: { 
      title: "Company Name", 
      viewWindowMode: "explicit", 
      viewWindow: { 
       max:5 
      } 
     }, 
     vAxis: { 
      title: "Issue Count" 
     } 
    }; 

    chart.draw(dataTable, options); 
} 

但這沒有工作任何想法?謝謝advnace

回答

1

下面這行有已被添加到CSS(層疊樣式表)文件或頁面內聯查詢風格:

#detailedCharts { 
    overflow-x: scroll;  
} 

在上面的問題,代碼顯示該圖表綁定到ID爲「detailedCharts」的元素,因此在上述樣式中,「#detailedCharts」用於將樣式應用於該元素。

let chart = new google.visualization.ColumnChart(document.getElementById("detailedCharts")); 
+0

,因爲我想它mabye我解釋自己錯了,我想,如果比如我有12個行只顯示5,其餘的是帶有滾動條 – Harry

+0

類似的東西可見這不起作用:HTTP: //jsfiddle.net/hsakX/? – Kornflexx

+0

是完美的非常感謝你會在2分鐘內接受答案,當我被允許 – Harry