Googleグラフにはすべてのラベルが表示されます

Question

ページに横棒グラフを表示したいと思います。私はGoogleの図書館を使用しています。私が抱えている問題は、いくつかのラベルが欠落しているということです。すべてのラベルを表示する方法はありますか？

google.charts.load('current', {packages: ['corechart', 'bar']}); 
google.charts.setOnLoadCallback(drawBasic); 

function drawBasic() { 

    var data = google.visualization.arrayToDataTable([ 
    ['City', '2010 Population', ], 
    ['New York City, NY', 8175000], 
    ['Los Angeles, CA', 3792000], 
    ['Chicago, IL', 2695000], 
    ['Houston, TX', 2099000], 
    ['Philadelphia, PA', 1526000], 
    ['New York City2, NY', 8175000], 
    ['Los Angeles2, CA', 3792000], 
    ['Chicago2, IL', 2695000], 
    ['Houston2, TX', 2099000], 
    ['Philadelphia2, PA', 1526000] 
    ]); 

    var options = { 
    title: 'Population of Largest U.S. Cities', 
    chartArea: { 
     width: '50%' 
    }, 
    hAxis: { 
     title: 'Total Population', 
     minValue: 0 
    }, 
    vAxis: { 
     title: 'City' 
    } 
    }; 

    var chart = new google.visualization.BarChart(document.getElementById('chart_div')); 

    chart.draw(data, options); 
} 

デモjsfiddle

あなたは11のラベル/値が存在することは、上記のコードでわかります。すべての値が表示されますが、他のすべてのラベルは表示されません。私はすべてのラベルを表示したいです。

Duplicate question < <この質問は頼まれましたが、それはあなたがそれぞれの軸ラベルのスペースを確保するために、chartArea

の特定のサイズと配置を設定することができ、異なるデータ構造

Answer 1

とチャートの異なる種類に関係そしてグラフのタイトル、説明文、などと一緒にタイトル

...

次の例を参照してください、を追加しました各エリア

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

 
function drawBasic() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['City', '2010 Population', ], 
 
    ['New York City, NY', 8175000], 
 
    ['Los Angeles, CA', 3792000], 
 
    ['Chicago, IL', 2695000], 
 
    ['Houston, TX', 2099000], 
 
    ['Philadelphia, PA', 1526000], 
 
    ['New York City2, NY', 8175000], 
 
    ['Los Angeles2, CA', 3792000], 
 
    ['Chicago2, IL', 2695000], 
 
    ['Houston2, TX', 2099000], 
 
    ['Philadelphia2, PA', 1526000] 
 
    ]); 
 

 
    var options = { 
 
    backgroundColor: 'cyan', 
 
    title: 'Population of Largest U.S. Cities', 
 

 
    // total size of chart 
 
    height: 600, 
 
    width: 900, 
 

 
    // adjust size of chart area 
 
    chartArea: { 
 
     backgroundColor: 'magenta', 
 

 
     // allow 70px for hAxis title and ticks 
 
     height: 480, 
 

 
     // allow 200px for vAxis title and ticks 
 
     left: 200, 
 

 
     // allow 50px for chart title 
 
     top: 50, 
 

 
     // allow 200px for legend on right 
 
     width: 500 
 
    }, 
 

 
    colors: ['yellow'], 
 
    hAxis: { 
 
     title: 'Total Population', 
 
     minValue: 0 
 
    }, 
 
    vAxis: { 
 
     title: 'City' 
 
    } 
 
    }; 
 

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

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

を強調するために