个人中心
gpt4 book ai didi

javascript - 当数据表输入来自服务器的 JSON 数据时更改 Google Chart 条形颜色

转载 作者：行者123 更新时间：2023-11-29 01:16:49 25 4
gpt4 key购买 nike

我一直在努力使用 google chart API。我在 SO PHP MySQL Google Chart JSON - Complete Example 上找到了这个绝妙的例子.

但是我想知道如何将条形颜色从默认蓝色更改。我对如何使用 { role: 'style' } 函数感到困惑。

这是我的代码:

     <?php
    $con=mysql_connect("localhost","username","pass") or die("Failed to connect with database");
    mysql_select_db("rosac", $con); 
    $query = mysql_query("
    SELECT TarikhLulusTahun AS Tahun, COUNT(*) AS Jumlah 
FROM association 
GROUP BY TarikhLulusTahun");


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

        array('label' => 'Tahun', 'type' => 'string'),
        array('label' => 'Jumlah Persatuan', 'type' => 'number')
        ({type: 'string', role: 'style'})

    );

    $rows = array();
    while($r = mysql_fetch_assoc($query)) {
        $temp = array();
        $temp[] = array('v' => (string) $r['Tahun']); 

        $temp[] = array('v' => (int) $r['Jumlah']); 
        $rows[] = array('c' => $temp);
    }

    $table['rows'] = $rows;
    $jsonTable = json_encode($table);
    //echo $jsonTable;
    ?>

    <html>
      <head>
        <!--Load the Ajax API-->
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript">

        // Load the Visualization API and the piechart package.
        google.load('visualization', '1', {'packages':['corechart']});

        // Set a callback to run when the Google Visualization API is loaded.
        google.setOnLoadCallback(drawChart);

        function drawChart() {

          // Create our data table out of JSON data loaded from server.
          var data = new google.visualization.DataTable(<?=$jsonTable?>);
          var options = {
               title: 'Jumlah Persatuan Berdaftar Mengikut Tahun',
              is3D: 'true',
              width: 1000,
              height: 1000,
             hAxis: {title: 'Tahun', titleTextStyle: {color: 'red'}},
             vAxis: {title: 'Jumlah Persatuan', titleTextStyle: {color: 'blue'}}
            };

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

      <body>
        <!--this is the div that will hold the pie chart-->
        <div id="chart_div"></div>
      </body>
    </html>

最佳答案

您需要做几件事。首先，你的专栏创建是错误的；这个:

$table['cols'] = array(
    array('label' => 'Tahun', 'type' => 'string'),
    array('label' => 'Jumlah Persatuan', 'type' => 'number')
    ({type: 'string', role: 'style'})
);

应该是这样的:

$table['cols'] = array(
    array('label' => 'Tahun', 'type' => 'string'),
    array('label' => 'Jumlah Persatuan', 'type' => 'number'),
    array('type' => 'string', 'p' => array('role' => 'style'))
);

然后，当您创建数据行时，您需要为样式添加一个单元格:

while($r = mysql_fetch_assoc($query)) {
    $temp = array();
    $temp[] = array('v' => (string) $r['Tahun']); 
    $temp[] = array('v' => (int) $r['Jumlah']); 
    $temp[] = array('v' => <insert style here>); 
    $rows[] = array('c' => $temp);
}

关于javascript - 当数据表输入来自服务器的 JSON 数据时更改 Google Chart 条形颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21118595/

25 4 0
文章推荐： ios - Xamarin - es.strings 文件中的重音符号阻止编译？
文章推荐： ios - 尝试将数组中的随机元素存储在变量 Swift 2 中时出错
文章推荐： android - 如何降级我的 Android Studio 项目中的 gradle wrapper 版本？
文章推荐： ios - 菜单场景中不显示 HighScore
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com