javascript - 根据最新的 2020 年 1 月版本，我如何倾斜/旋转 horizo​​nata/垂直条形图的 hAxis 和 vAxis 文本

Question

我没有找到任何关于如何在条形图中实现 slantedText 选项的解决方案。 谷歌是否从其最新版本中删除了 slantedText 属性？

这是我的代码:-

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

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

    function drawChart() {
      // Define the chart to be drawn.
      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]
      ]);

      var options = {
        title: 'Population of Largest U.S. Cities',
        chartArea: {width: '50%'},
        legend: { position: "bottom" },
        hAxis: {
          title: 'Total Population',
          minValue: 0,
          slantedText: true,
          slantedTextAngle: 60
        },
        vAxis: {
          title: 'City'
        }
      }

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

</script>

Answer 1

google.charts.Bar 被认为是一个material 图表，
material 图表不支持多个选项，包括...

{hAxis,vAxis,hAxes.*,vAxes.*}.slantedText
{hAxis,vAxis,hAxes.*,vAxes.*}.slantedTextAngle

参见 Tracking Issue for Material Chart Feature Parity

相反，您需要使用经典 图表。

google.visualization.ColumnChart

或

google.visualization.BarChart