hello
this is my code :
!function($) {
//google.load('visualization', '1.0', {'packages':['table']});
google.load('visualization', '1', {packages: ['corechart']});
google.load('visualization', '1.1', {packages: ['controls']});
google.setOnLoadCallback(initialize);
function populateSelectWithOptions(target, data)
{
console.log(data, typeof(data));
var $select =$("#"+target);
$select.empty();
for(var i=0; i <data.length;i++){
$select.append($("<option>").attr("value", data[i]).text(data[i]));
}
$select.prop('disabled', false);
$select.change(function (){
var e = document.getElementById("groupe");
var strUser = e.options[e.selectedIndex].value;
//alert(strUser);
sendQuery(strUser)
});
// baraie inke vaghti bara avalin bar safe lod mishavad dar chekbox
chizi vojod dashte bashad
$select.trigger('change');
//console.log(populateSelectWithOptions(target, data));
};
function sendQuery(cityName) {
// You can manipulate the variable response
// Success!
var query = new
google.visualization.Query('http://api.batisense.com/batisense/datasource?table='+cityName);
query.setQuery("select (cost_reportings_timestamp), sum
(cost_reportings_cost) group by (cost_reportings_timestamp) pivot
ecoadmin_zone_name");
//Send the query with a callback function.
query.send(drawChart);
//console.log(response);
}
function drawChart(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}
var data = response.getDataTable();
console.log(data);
var control = new google.visualization.ControlWrapper({
controlType: 'ChartRangeFilter',
containerId: 'control',
options: {
// Filter by the date axis.
filterColumnLabel: 'cost_reportings_timestamp',
ui: {
chartType: 'LineChart',
chartOptions: {
chartArea: {
width: '90%'
},
hAxis: {
baselineColor: 'none'
}
},
// Display a single series that shows the
closing value of the stock.
// Thus, this view has two columns: the date
(axis) and the stock value (line series).
chartView: {
columns: [0,1]
}
}
},
//Initial range: 2010 to 2021
state: {
range: {
start: new Date(2012),
end: new Date(2019)
}
}
})
// Define a bar chart
var ComboChart = new google.visualization.ChartWrapper({
chartType: 'ComboChart',
containerId: 'ComboChart',
options: {
width: 400,
height: 300,
seriesType: 'bars',
isStacked:'True',
hAxis: {
minValue: 0,
maxValue: 60
},
chartArea: {
top: 0,
right: 0,
bottom: 0
},
},
view: {columns: [0, 1, 2, 3]}
});
// Create the dashboard.
var dashboard = new
google.visualization.Dashboard(document.getElementById('dashboard')).
// Configure the slider to affect the bar chart
bind([control], [ComboChart]).
// Draw the dashboard
draw(data);
}
function initialize() {
var $newDiv = $('<div>').attr('id','ComboChart');
$('#ComboChart').append($newDiv);
$($newDiv).hide(); //hide the div here
// Replace the data source URL on next line with your data
source URL.
// Specify that we want to use the XmlHttpRequest object to
make the query.
getTable();
}
// baraie inke vaghti ro elemenha click mikonim piecharto
ieshon bede
$("#groupe").change( function () {
$('#ComboChart').toggle(); //If it is visible hide it or vice
versa
//..
});
function getTable() {
$.getJSON('call/json/mytables', {}, function (response){
console.log(response);
populateSelectWithOptions("groupe", response);
})
}
}(jQuery);
and i have this error
One or more participants failed to draw()×
janv. 2013janv. 2013févr. 2013févr. 2013mars 2013mars 2013avr. 2013avr.
2013mai 2013mai 2013juin 2013juin 2013juil. 2013juil. 2013août 2013août 2013
i can't see my ComboChart, could you help me???
--
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/groups/opt_out.
