如何在谷歌图表api中垂直对齐图表的柱形图？

Question

我正在使用谷歌图表api在我的应用程序中开发图形，一切都很好我能够生成图形。我正在使用柱形图表，图形上的图例水平传播。我在柱形图中有20列所以传说相互影响。我怎样才能垂直对齐它们。 请帮助我。

<script type="text/javascript" src="http://10.211.30.24/assetinv/js/jsapi.js"></script>   
 <script type="text/javascript">     
 google.load("visualization", "1", {packages:["corechart"]}); 

 google.setOnLoadCallback(drawChart);  

<?php

    /* Your Database Name */
    $dbname = 'finalCMS';

    /* Your Database User Name and Passowrd */
    $username = 'assetuser';
    $password = 'password1!';

    try {
      /* Establish the database connection */
      $conn = new PDO("mysql:host=localhost;dbname=$dbname", $username, $password);
      $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

      /* select all the weekly tasks from the table googlechart */
$result = $conn->query("SELECT `EquipmentMainCatagory`,count(`EquipmentMainCatagory`) as CountofAssets from asset a join assetinfo ai on a.assetid=ai.assetid and upper(ai.EquipmentStatus) like upper('%Active%') group by EquipmentMainCatagory");

      $rows = array();
      $table = array();
      $table['cols'] = array(

        // Labels for your chart, these represent the column titles.
        /* 
            note that one column is in "string" format and another one is in "number" format 
            as pie chart only required "numbers" for calculating percentage 
            and string will be used for Slice title
        */


        array('label' => 'EquipmentMainCatagory', 'type' => 'string'),
        array('label' => 'CountofAssets', 'type' => 'number')

    );
        /* Extract the information from $result */
        foreach($result as $r) {

          $temp = array();

          // the following line will be used to slice the Pie chart


          // Values of each slice
          $temp[] = array('v' => (string) $r['EquipmentMainCatagory']);
          $temp[] = array('v' => (float) $r['CountofAssets']); 
          $rows[] = array('c' => $temp);
        }

    $table['rows'] = $rows;

    // convert data into JSON format
    $jsonTable = json_encode($table);

    } catch(PDOException $e) {
        echo 'ERROR: ' . $e->getMessage();
    }
    //mysql_close($conn);

     $conn=null;

    ?>







    function drawChart() 
     {   

      var data = new google.visualization.DataTable(<?php echo $jsonTable?>);

       //data.setColumns([0, 1,
    //                       { calc: "stringify",
    //                         sourceColumn: 1,
    //                         type: "string",
    //                         role: "annotation" }
    //                       ]);
          var options = {
               title: 'Overall Equipment Categorization Statistics',

              width: 1000,
             height: 500,
              colors: ['#6495ED','#00FF00'],
              vAxis: {title: '# of Assets',titleTextStyle:{bold : true,italic:false}},
              hAxis: {title: 'EquipmentMainCategory', titleTextStyle: {color: 'red'}},
        //hAxis: {title: "Month"},


              series: {5: {type: "line"}
              }

            };


        //options.chd=t:data;
        //options.chds=a;

          // Instantiate and draw our chart, passing in some options.
          // Do not forget to check your div ID

                var chart1 = new google.visualization.ColumnChart(document.getElementById('piechart_3dmo1'));





         chart1.draw(data, options);


     }
     </script> 



      <div id="piechart_3dmo1" style="width: 1000px; height: 500px; position: relative;left: 221px;"></div> 
      'function drawChart() 
 {   

  var data = new google.visualization.DataTable({"cols":[{"label":"EquipmentMainCatagory","type":"string"},{"label":"count(`EquipmentMainCatagory`)","type":"number"}],"rows":[{"c":[{"v":""},{"v":1}]},{"c":[{"v":"Applications"},{"v":47}]},{"c":[{"v":"Backup Server"},{"v":11}]},{"c":[{"v":"Basic Infra (AD, SCCM, NAV,etc...)"},{"v":48}]},{"c":[{"v":"BMS, PBX and Others"},{"v":7}]},{"c":[{"v":"Database"},{"v":16}]},{"c":[{"v":"DMZ (External)"},{"v":13}]},{"c":[{"v":"EIS Applications"},{"v":7}]},{"c":[{"v":"File and Print"},{"v":27}]},{"c":[{"v":"Mail and Messaging"},{"v":17}]},{"c":[{"v":"Non Server"},{"v":8}]},{"c":[{"v":"SAP or ERP"},{"v":26}]},{"c":[{"v":"Storage"},{"v":2}]},{"c":[{"v":"VM Host"},{"v":1}]}]});

   //data.setColumns([0, 1,
//                       { calc: "stringify",
//                         sourceColumn: 1,
//                         type: "string",
//                         role: "annotation" }
//                       ]);
      var options = {
           title: 'Equipment Categorization Statistics of SEA',

         width: 1000,
         height: 500,
          colors: ['#6495ED','#00FF00'],
          vAxis: {title: '# of Assets',titleTextStyle:{bold : true,italic:false}},
          hAxis: {title: 'EquipmentMainCategory', titleTextStyle: {color: 'red'}},


          series: {5: {type: "line"}
          }

        };


    //options.chd=t:data;
    //options.chds=a;

      // Instantiate and draw our chart, passing in some options.
      // Do not forget to check your div ID

            var chart1 = new google.visualization.ColumnChart(document.getElementById('piechart_3dmsea'));





     chart1.draw(data, options);


 }
 </script> 



  <div id="piechart_3dmsea" style="width: 1000px; height: 500px; position: relative;left: 221px;"></div> 



</div>
'