В настоящее время у меня есть 2 диаграммы на странице, которые заполняются с помощью MYSQL, и 1 из них гистограмма, другая круговая диаграмма
Мне успешно удалось изменить цвета столбцов на основе mysql, но я не могукажется, что можно использовать один и тот же код для изменения цветов круговой диаграммы, в результате чего я получаю, что вся диаграмма станет цветом самого большого среза, например, для данных в таблице под всей диаграммой станет КРАСНЫМ как самый большой срез
строка данных выглядит следующим образом:
|---------------------|------------------|
| location | beacon |
|---------------------|------------------|
| RED | 34 |
|---------------------|------------------|
| Blue | 34 |
|---------------------|------------------|
| Green | 34 |
|---------------------|------------------|
| RED | 34 |
|---------------------|------------------|
| Yellow | 34 |
|---------------------|------------------|
, поэтому желаемый результат графиков будет 4 среза: красный, синий, зеленый, желтый
.диаграмма заполняется mysql. Я не могу определить цвета вручную, так как способ, которым получаются сечения, может отличаться при каждой загрузке диаграммы.
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart()
{
var data = google.visualization.arrayToDataTable([
['location', 'count'],
<?php
$connect = mysqli_connect("localhost", "user", "password", "test");
if(isset($_POST['but_search'])){
$fromDate = $_POST['fromDate'];
$endDate = $_POST['endDate'];
if(!empty($fromDate) && !empty($endDate)){
$emp_query .= " and date_of_join
between '".$fromDate."' and '".$endDate."' ";
}
}
$query = "SELECT location,count(location) as customer_count FROM test.filter where date between '".$fromDate."' and '".$endDate."' group by location ";
$result = mysqli_query($connect, $query);
while($row = mysqli_fetch_array($result))
{
echo "['".$row["location"]."', ".$row["count"]."],";
}
?>
]);
for (var i = 0; i < data.getNumberOfRows(); i++) {
var colors = [];
colors.push(data.getValue(i, 0));
var options = {
title: 'Zone Statistics',
is3D:false,
pieHole: 0.4,
colors: colors,
textStyle:{color: 'black'},
legend:{position: 'none'},
chartArea: {width: 550, height: 300},
legend: 'labeled',
pieSliceText: 'none',
backgroundColor: '#E4E4E4',
};
var chart = new google.visualization.PieChart(document.getElementById('pie'));
chart.draw(data, options);
};
}
</script>