Serey,
I'm not sure if you can help at this point but thought it is worth a try.
The source works beautiful within the JS Fiddle environment, but when I put
it into my source code (Alpha Anywhere development environment), I get an
error in IE when I run the code (Firefox does nothing. no error but doesn't
recognize the click event on the gauge either):
My javascript function is EXACTLY as it is in JS Fiddle which I've also
copied and pasted here:
google.load('visualization', '1', {packages: ['controls']});
google.setOnLoadCallback(drawTaskChart);
*function drawTaskChart() {*
var chartdata = {dialog.object}._data;
// Prepare the data
var data = google.visualization.arrayToDataTable(
chartdata
);
// set up gauge datatable
var gaugeData = new google.visualization.DataTable();
gaugeData.addColumn('string', 'Project');
gaugeData.addColumn('number', 'Pct');
var gauge1 = new google.visualization.ChartWrapper({
chartType: 'Gauge',
dataTable: gaugeData,
containerId: 'charttasks',
options: {
width: 200,
height: 200,
min: 0,
max: 100,
animation: {
duration: 1000,
easing: 'inAndOut'
},
redFrom: 0,
redTo: 33,
yellowFrom: 33,
yellowTo: 66,
greenFrom: 66,
greenTo: 100,
majorTicks: ['0', '20', '40', '60', '80', '100']
},
view: {
rows: [0] // restrict to the first row only
}
});
// Define category pickers for 'Project'
var ProjectPicker = new google.visualization.ControlWrapper({
controlType: 'CategoryFilter',
containerId: 'Projects',
options: {
filterColumnLabel:'Project',
// filterColumnIndex: 1, // filter on the 2nd column
ui: {
labelStacking: 'vertical',
allowTyping: true,
allowMultiple: false,
caption: 'Pick a Project',
label: 'Select a Project'
}
}
});
var dashboard = new
google.visualization.Dashboard(document.getElementById('dashboard'));
dashboard.bind([ProjectPicker], [gauge1]);
dashboard.draw(data);
document.getElementById('gauge1').addEventListener('click', function ()
{
// selection is an array of objects with {row, column} properties,
// use them to get data from your DataTable if you need to, ie:
var selectedValue = gauge1.getDataTable().getValue(0, 1);
// you can then emulate clicking a link from here
alert('You clicked on ' + selectedValue );
// window.location.href = "http://www.google.com/";;
});
};
Is there anything more I need to do to "register" the Listener event or do
you know of anything else that might cause this or recommend how I can
troubleshoot?
Thanks again.
> document.getElementById('gauge1').addEventListener('click', function () {
> // selection is an array of objects with {row, column} properties,
> // use them to get data from your DataTable if you need to, ie:
> var selectedValue = gauge1.getDataTable().getValue(0, 1);
> // you can then emulate clicking a link from here
> alert('You clicked on ' + selectedValue );
> window.location.href = "http://www.google.com/";;
> });
>
> On Mon Jan 05 2015 at 11:23:25 AM <[email protected] <javascript:>> wrote:
>
>> Hi everyone,
>>
>> I have a gage with a dropdown and would like to be able to click the
>> gauge and navigate to the record that was selected from the dropdown. I
>> found some help on your message board about how to make a chart emulate a
>> hyperlink and I've added the following code but it doesn't seem to do
>> anything. It doesn't cause an error or anything either. It just does
>> nothing:
>>
>>
>> google.visualization.events.addListener(gauge1, 'select', function ()
>> {
>> var selection = gauge1.getSelection();
>> // selection is an array of objects with {row, column} properties,
>> // use them to get data from your DataTable if you need to, ie:
>> var selectedValue = gaugeData.getValue(selection[0].row,
>> selection[0].column);
>> // you can then emulate clicking a link from here
>> alert('You clicked on ' + selectedValue );
>> window.location.href = "http://www.google.com/";;
>> });
>>
>>
>> Here is a jsfiddle with all my logic. Any advice you can offer is
>> greatly appreciated.
>> http://jsfiddle.net/sremias/y9nq2bqe/3/
>>
>>
>> --
>> 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]
>> <javascript:>.
>> To post to this group, send email to [email protected]
>> <javascript:>.
>> Visit this group at
>> http://groups.google.com/group/google-visualization-api.
>> For more options, visit https://groups.google.com/d/optout.
>>
>
--
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.
