Remove blank space above and below Google Charts horizontal column chart

debugcn 에 게시 Dev

Technoh

I am show graphs from Google Charts, using a horizontal column chart. I want to remove the blank space above and below the graph.

Here is the code called (some info removed due to NDA):

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);

function drawChart() {
    var data = google.visualization.arrayToDataTable([
        [null, "...","...","...","...","...","...","...","...","Total Average"],
        [null, 100,100,100,100,100,88.89,100,100,98.70]
    ]);

    var options = {
        height: 540,
        title: 'Title here',
        vAxis: { textPosition: 'none', viewWindowMode: 'maximized' },
        colors:["#0B0842","#ADAEAE","#BE3351","#498101","#0D80CA","#A3C116","#91A96B","#E8F72B","#424242"],
        hAxis: { textPosition: 'none', minValue: 0, maxValue: 100 },
        chartArea: { left: 0, width: "78%" },
    };

    var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}

Sample graph

asgallant

The space above and below the bars is normally there to separate bar groups when you have multiple rows of data. If you don't want that space, then you can set the bar.groupWidth option in your chart to a larger percentage (up to 100%; default is the golden ratio, roughly 61.8%):

var options = {
    height: 540,
    title: 'Title here',
    vAxis: { textPosition: 'none', viewWindowMode: 'maximized' },
    colors:["#0B0842","#ADAEAE","#BE3351","#498101","#0D80CA","#A3C116","#91A96B","#E8F72B","#424242"],
    hAxis: { textPosition: 'none', minValue: 0, maxValue: 100 },
    chartArea: { left: 0, width: "78%" },
    bar: {groupWidth: '100%'}
};

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정2021-05-29

몇 마디 만하겠습니다

0리뷰

로그인참여 후 검토

Related 관련 기사

기사

Remove blank space above and below Google Charts horizontal column chart

Remove blank space above and below Google Charts horizontal column chart

Remove rows from Dataframe where row above or below has same value in a specific column

Google Charts remove white border around vAxis textPosition 'in' text on Bar Chart

How to change section color of a stacked bar chart in Google Charts API?

white space below footer

Google Column Chart change color for each column with json

Google Column Chart change color for each column with json

Remove words (letters followed by space) from a specific column

how do i remove the space at at the end of the column header?

Google Charts - How to stretch x axis over chart's full width

vAxis : {slantedText : true}는 Bar Chart [Google Charts]에서 가능합니까?

How can I draw an additional horizontal grid line with a specific value in Google Bar chart (Not average value)

Calculated text column for Google Line Chart x-axis not working

How to remove Pie Charts from Google Maps API V3 on this example?

Dynamically extended chart, horizontal data

Google Charts API CalendarChart

Google Charts - BoxPlot

Google Charts mysql PHP

Charts.Chart를 Google Sheet에 삽입하는 방법 (스크립트 앱)

JSP JSON with Google Charts - Line Charts

column width not controlled by row above it

Remove shadow below actionbar FragmentActivity

Matplotlib ax.fill_between fills above, instead of below

Horizontal bar chart y axis alignment

Unwanted blank space generated at the end of page

Deleting all cells in row after blank space

Notepad++ Regex - Replace a blank space in dates

Add and number blank line above each line in a file

Google charts are not showing in Snappy PDF

Google Charts json data not loading