Haxis文字不会显示所有记录,也无法倾斜

时间:2019-10-14 21:11:17

标签: google-visualization

我使用Google图表显示堆叠的条形图(每年两个条形图)。

数据显示的很好,但是轴(年)应该倾斜(即30度),并且应该每五年显示一次以上。

任何建议都值得欢迎。谢谢!

图片在我的保管箱中。 https://www.dropbox.com/s/niru4cyw8x4m98m/stack.png?dl=0

"data:text/html;charset=UTF-8,<html>  <head>
    <script type=\"text/javascript\" src=\"https://www.gstatic.com/charts/loader.js\"></script>
    <script type=\"text/javascript\">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['', 'Investiertes Vermögen', 'Kumulierter Gewinn/Verlust'],
          [" & InvestKapital::Jahr01a & ", " & InvestKapital::InvestKapital01a & "," & InvestKapital::KumErfolg01a & "],
          [" & InvestKapital::Jahr01b & ", " & InvestKapital::InvestKapital01b & "," & InvestKapital::KumErfolg01b & "],
          [" & InvestKapital::Jahr02a & ", " & InvestKapital::InvestKapital02a & "," & InvestKapital::KumErfolg02a & "],
          [" & InvestKapital::Jahr02a & ", " & InvestKapital::InvestKapital02b & "," & InvestKapital::KumErfolg02b & "],
          [" & InvestKapital::Jahr03a & ", " & InvestKapital::InvestKapital03a & "," & InvestKapital::KumErfolg03a & "],
          [" & InvestKapital::Jahr03a & ", " & InvestKapital::InvestKapital03b & "," & InvestKapital::KumErfolg03b & "],
          [" & InvestKapital::Jahr04a & ", " & InvestKapital::InvestKapital04a & "," & InvestKapital::KumErfolg04a & "],
          [" & InvestKapital::Jahr04a & ", " & InvestKapital::InvestKapital04b & "," & InvestKapital::KumErfolg04b & "],
          [" & InvestKapital::Jahr05a & ", " & InvestKapital::InvestKapital05a & "," & InvestKapital::KumErfolg05a & "],
          [" & InvestKapital::Jahr05a & ", " & InvestKapital::InvestKapital05b & "," & InvestKapital::KumErfolg05b & "],
          [" & InvestKapital::Jahr06a & ", " & InvestKapital::InvestKapital06a & "," & InvestKapital::KumErfolg06a & "],
          [" & InvestKapital::Jahr06a & ", " & InvestKapital::InvestKapital06b & "," & InvestKapital::KumErfolg06b & "],
          [" & InvestKapital::Jahr07a & ",  "& InvestKapital::InvestKapital07a & "," & InvestKapital::KumErfolg07a & "],
          [" & InvestKapital::Jahr07a & ", " & InvestKapital::InvestKapital07b & "," & InvestKapital::KumErfolg07b & "],
          [" & InvestKapital::Jahr08a & ", " & InvestKapital::InvestKapital08a & "," & InvestKapital::KumErfolg08a & "],
          [" & InvestKapital::Jahr08b & ", " & InvestKapital::InvestKapital08b & "," & InvestKapital::KumErfolg08b & "],
          [" & InvestKapital::Jahr09a & ",  "& InvestKapital::InvestKapital09a & "," & InvestKapital::KumErfolg09a & "],
          [" & InvestKapital::Jahr09a & ", " & InvestKapital::InvestKapital09b & "," & InvestKapital::KumErfolg09b & "],
          [" & InvestKapital::Jahr10a & ", " & InvestKapital::InvestKapital10a & "," & InvestKapital::KumErfolg10a & "],
          [" & InvestKapital::Jahr10b & ", " & InvestKapital::InvestKapital10b & "," & InvestKapital::KumErfolg10b & "]

        ], false);
         var options = {
           isStacked: true,
           tooltip: {
                         textStyle: {color: '#000000', fontName: 'Mrs Eaves XL Serif OT', fontSize: 9},
               },
           legend: {position: 'none', textStyle: {color: '#000000', fontSize: 9}
               },
           vAxis: {minValue: 0,  
                       textStyle: {color: '#000000', fontName: 'Mrs Eaves XL Serif OT', fontSize: 10},
               },
           hAxis: {format: '', 
                       textStyle: {color: '#000000', fontName: 'Mrs Eaves XL Serif OT', fontSize: 9},
                       slantedText: true, 
                       maxAlternation: 1, // use a maximum of 1 line of labels
                       showTextEvery: 1, // show every label if possible
                       minTextSpacing: 1, // minimum spacing between adjacent labels, in pixels
              },
             series: {
              0:{color:'#0A5550'},
              1:{color:'#8C8C91'},
             },
        };    
        var chart = new google.charts.Bar(document.getElementById('columnchart_material'));
        chart.draw(data, google.charts.Bar.convertOptions(options));}
    </script>  </head>  <body>
    <div id=\"columnchart_material\" style=\"width: 350px; height: 190px;\"></div>
  </body> </html>"

0 个答案:

没有答案