我一直在努力使用 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/