I would like to know how to pass a value transparently to the chart, I have to get the ID of a column in the database. The way I'm doing I need to pass as follows: Column Title | ID
I would like to know how to pass a value transparently to the chart, I have to get the ID of a column in the database. The way I'm doing I need to pass as follows: Column Title | ID
Use the wrapper to insert all packages from GoogleChart, so you do not need to pass dependencies on load:
google.visualization.events.addListener(chart, 'select', function () {
//dentro do seu método de events listener, insira o wrapper
var wrapper = new google.visualization.ChartWrapper();
wrapper.draw();
...
}
In the call just load this:
google.load('visualization', '1.1', {callback: drawChart});
And instead of using DataView(data)
to mount the data list, use in array format, there you assemble your collection in this way, which can be the database data, in a json via $.ajax({})
:
var collection = [
["Unidade", "Quantidade"],
["A", 519368.43],
["B", 2645777.75],
["C", 2227381.79]
];
var numberFormat = {
fractionDigits: 0,
groupingSymbol: '.',
negativeColor: 'red',
negativeParens: true,
prefix: ''};
}
var dateFormat = { pattern: "dd/MM/yyyy" };
var options = {
title: "titulo do chart",
animation: {easing: 'inAndOut', duration: 2000},
pointSize: 15,
fontSize: 10,
bar: {groupWidth: '75%'},
titleFontSize: 26,
tooltip: {isHtml: true, fontSize: 12},
hAxis: {
direction: 1,
slantedText: true,
slantedTextAngle: 15
},
width: 800,
height: 400,
legend: {position: 'top', maxLines: 3},
isStacked: true
};
var data = new google.visualization.arrayToDataTable(collection);
var formatter = new google.visualization.NumberFormat(numberFormat);
for (var i in collection) {
formatter.format(data, i);
}
var dateFormatter = new google.visualization.DateFormat(dateFormat);
dateFormatter.format(data, 0);
wrapper.setChartType('BarChart');
wrapper.setContainerId('#id_elemento_div');
wrapper.setDataTable(data);
wrapper.setOptions(options);
/* se precisar criar uma ação secundária...
wrapper.getChart().setAction({
id: 2,
text: 'um texto aqui',
action: function () { //seus métodos }
});
*/
In PHP you make a cast in type:
(string) "noma da unidade"; (int) 123;
Here's an example of how to manipulate subtitle text:
$('svg').bind('DOMSubtreeModified', function () {
var elems = $('svg').find('text:contains("%)")');
if (elems.length == 0) return;
var elem = $(elems.first());
elem.text("<SEU TEXTO AQUI>");
});