Ich sitze in der Lage, in einem Google Visualization-Diagramm Schrägstrichmarkierungen in einem Winkel anzuzeigen?

Guten Morgen:Ich sitze in der Lage, in einem Google Visualization-Diagramm Schrägstrichmarkierungen in einem Winkel anzuzeigen?

Ich möchte meine Balkendiagramme Strichmarkierungen in einem Winkel anzeigen. Ist das möglich? Mein Code ist mit einem einfachen Diagramm von Google enthalten.

Vielen Dank für Ihre Unterstützung, Natalie

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
    <head> 
    <!--Load the AJAX API--> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript"> 

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

     google.charts.setOnLoadCallback(drawChart); 

     function drawChart() { 

     var data = google.visualization.arrayToDataTable([ 

      ['Topping', 'Slices',], 

      ['Mushrooms', 300], 
      ['Onions', 100], 
      ['Olives', 500], 
      ['Zucchini', 200], 
      ['Pepperoni', 100] 
     ]); 

     var options = {'title':'How Much Pizza I Ate Last Night', 
         'width':400, 
         'height':300, 
         'hAxis':{ 
         ticks: [250, 300,], 
         gridlines: {color: 'blue'}, 
         textStyle:{color: 'blue',} 
         }, 
         }; 

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

    <body> 
    <div id="chart_div"></div> 
    </body> 
</html>

Quelle

2016-05-06 Natalie

fügen Sie einfach slantedText: true auf Ihre Konfigurationsoptionen

wenn Sie einen bestimmten Winkel benötigen, slantedTextAngle: number

siehe folgendes Beispiel verwenden ...

google.charts.load('current', { 
 
    callback: function() { 
 
    new google.visualization.BarChart(document.getElementById('chart_div')).draw(
 
     google.visualization.arrayToDataTable([ 
 
     ['Topping', 'Slices',], 
 
     ['Mushrooms', 300], 
 
     ['Onions', 100], 
 
     ['Olives', 500], 
 
     ['Zucchini', 200], 
 
     ['Pepperoni', 100] 
 
     ]), 
 
     { 
 
     title: 'How Much Pizza I Ate Last Night', 
 
     width: 400, 
 
     height: 300, 
 
     hAxis: { 
 
      ticks: [250, 300], 
 
      gridlines: {color: 'blue'}, 
 
      // slant hAxis labels 
 
      slantedText: true, 
 
      slantedTextAngle: 33, 
 
      textStyle: {color: 'blue'} 
 
     } 
 
     } 
 
    ); 
 
    }, 
 
    packages:['corechart'] 
 
});

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

Quelle

2016-05-06 14:45:50 WhiteHat

Perfekt wieder WhiteHat. Vielen Dank. Ich habe die gesamte Google-Dokumentation nach dieser Antwort durchgesehen und konnte sie nicht finden. Gibt es eine Dokumentation, die alle "Optionen" -Möglichkeiten identifiziert, an die Sie mich verweisen könnten? – Natalie

Leider gibt es nicht eine Seite, auf der alle angezeigt werden. Die Optionen mit der Option "slanted" sind in den Konfigurationsoptionen für [LineChart] (https://developers.google.com/chart/interactive/docs/gallery/linechart) aufgeführt # configuration-options) - es scheint, die meisten aufzulisten - ich überprüfe normalerweise dort oder das [ColumnChart] (https://developers.google.com/chart/interactive/docs/gallery/columnchart#configuration-options) – WhiteHat

Ich sitze in der Lage, in einem Google Visualization-Diagramm Schrägstrichmarkierungen in einem Winkel anzuzeigen?

Antwort

Verwandte Themen