Hello everybody!
I'm trying to make Donut Chart using Google Charts. I get data from
database - json format. I've seen example format for json data and I tried
it. Now my pie chart looks in this way: http://prntscr.com/7fmpnx
It shows data - these 2 firms but it's not donut. Am I missing something?
My json data is:
{"cols":[{"id":"name","label":"Name","type":"string"},{"id":"incomes","label":"Incomes","type":"number"}],"rows":[{"c":[{"v":"Kaufland"},{"v":"48"}]},{"c":[{"v":"Billa"},{"v":"24"}]},{"c":[{"v":"Hans"},{"v":"42"}]}]}
This is my model:
<?php
public function pie_chart() {
$interval = $this->uri->segment(3);
$firms =
$this->receivedOrders_model->average_incomes_by_customer($interval);
$p = array();
foreach ($firms as $key => $firm) {
$p[$key] = array('c' => array(array(
'v' => $firm->name
),
array(
'v' => $firm->incomes
)));
}
echo json_encode(array(
'cols' => array(
array('id' => 'name', 'label' => 'Name', 'type' => 'string'),
array('id' => 'incomes', 'label' => 'Incomes', 'type' => 'number'),
),
'rows' => $p
));
}
My view is:
$(document).ready(function() {
$('#interval').change(function(){
var interval = $('#interval').val(); //This is when user choose interval
to display donut data - for example 1 month
if(interval != ''){
$.ajax({
type: 'get',
url: "<?= base_url() ?>index.php/receivedOrders/pie_chart/" + interval,
dataType: "json",
success: function(jsonData){
drawChart(jsonData);
}
});
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart(jsonData) {
var data = new google.visualization.DataTable(jsonData);
var options = {
title: '',
pieHole: 0.4,
width:'380',
height:'300',
'chartArea': {'width': '100%', 'height': '80%',
left:10,top:'20',right:10},
backgroundColor:'#FFFFFF',
pieSliceText: 'none',
legend: {
position: 'labeled'
},
colors:['#1abc9c','#2ecc71','#3498db','#9b59b6','#34495e',
'#16a085','#2cc36b','#2980b9', '#8e44ad','#2c3e50',
'#f1c40f','#e67e22','#e74c3c','#ecf0f1','#95a5a6',
'#f39c12','#d35400','#c0392b','#bdc3c7','#7f8c8d']
};
var chart = new
google.visualization.PieChart(document.getElementById('piechart'));
chart.draw(data, options);
}
}});
});
My model is:
<?php
public function average_incomes_by_customer($interval = null) {
if($interval) {
if($interval == 1) {
$date = new DateTime("now");
$date->modify('-1 month');
$current =$date->format('Y-m-d');
}
if($interval == 3) {
$date = new DateTime("now");
$date->modify('-3 month');
$current =$date->format('Y-m-d');
}
}
$this->db->select('customer.name,orderitems.incomes');
$this->db->from('orderitems');
$this->db->join('ordersheader', 'ordersheader.idOrder=
orderitems.idOrder');
$this->db->join('customer', 'ordersheader.idCustomer=
customer.idCustomer','left');
if($interval) {
$this->db->where('ordersheader.createdDate >
',$current);
}
$this->db->group_by('ordersheader.idCustomer');
$query=$this->db->get();
return $query->result();
}
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
