ATL - hideDataColumns: doesn't work
27 views
Skip to first unread message
Oren
Dec 22, 2010, 5:57:43 AM12/22/10
to Google Visualization API
Hi,
I am trying to find out why the method hideDataColumns() doesn't work
for me in Annotated Time Line visualization.
I searched in the forums and I noticed that several people reported
the same problem and the reason for the problem was that they run the
code locally (file://....). I am running the code on a local web
server so this is not the problem I encountered.
The code is very basic and is based on the example at the web site.
You can test it on your machine.
Anyone has a clue?
---------------- the code -----------------
<html>
<head>
<script type='text/javascript' src='https://www.google.com/
jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages':
['annotatedtimeline']});
google.setOnLoadCallback(drawVisualization);
function drawVisualization() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Sold Pencils');
data.addColumn('number', 'Sold Pens');
data.addColumn('number', 'Sold notebooks');
data.addRows(6);
data.setValue(0, 0, new Date(2008, 1 ,1));
data.setValue(0, 1, 30000);
data.setValue(0, 2, 40645);
data.setValue(0, 3, 30645);
data.setValue(1, 0, new Date(2008, 1 ,2));
data.setValue(1, 1, 14045);
data.setValue(1, 2, 20374);
data.setValue(1, 3, 10374);
data.setValue(2, 0, new Date(2008, 1 ,3));
data.setValue(2, 1, 55022);
data.setValue(2, 2, 50766);
data.setValue(2, 3, 40766);
data.setValue(3, 0, new Date(2008, 1 ,4));
data.setValue(3, 1, 75284);
data.setValue(3, 2, 14334);
data.setValue(3, 3, 04334);
data.setValue(4, 0, new Date(2008, 1 ,5));
data.setValue(4, 1, 41476);
data.setValue(4, 2, 66467);
data.setValue(4, 3, 56467);
data.setValue(5, 0, new Date(2008, 1 ,6));
data.setValue(5, 1, 33322);
data.setValue(5, 2, 39463);
data.setValue(5, 3, 29463);
var annotatedtimeline = new google.visualization.AnnotatedTimeLine(
document.getElementById('chart_div'));
annotatedtimeline.draw(data, {'displayAnnotations': true});
annotatedtimeline.hideDataColumns(3);
}
</script>
</head>
<body>
<div id='chart_div' style='width: 700px; height: 240px;'></div>
</body>
</html>
------------ end of code ---------------------
I am trying to find out why the method hideDataColumns() doesn't work
for me in Annotated Time Line visualization.
I searched in the forums and I noticed that several people reported
the same problem and the reason for the problem was that they run the
code locally (file://....). I am running the code on a local web
server so this is not the problem I encountered.
The code is very basic and is based on the example at the web site.
You can test it on your machine.
Anyone has a clue?
---------------- the code -----------------
<html>
<head>
<script type='text/javascript' src='https://www.google.com/
jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages':
['annotatedtimeline']});
google.setOnLoadCallback(drawVisualization);
function drawVisualization() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Sold Pencils');
data.addColumn('number', 'Sold Pens');
data.addColumn('number', 'Sold notebooks');
data.addRows(6);
data.setValue(0, 0, new Date(2008, 1 ,1));
data.setValue(0, 1, 30000);
data.setValue(0, 2, 40645);
data.setValue(0, 3, 30645);
data.setValue(1, 0, new Date(2008, 1 ,2));
data.setValue(1, 1, 14045);
data.setValue(1, 2, 20374);
data.setValue(1, 3, 10374);
data.setValue(2, 0, new Date(2008, 1 ,3));
data.setValue(2, 1, 55022);
data.setValue(2, 2, 50766);
data.setValue(2, 3, 40766);
data.setValue(3, 0, new Date(2008, 1 ,4));
data.setValue(3, 1, 75284);
data.setValue(3, 2, 14334);
data.setValue(3, 3, 04334);
data.setValue(4, 0, new Date(2008, 1 ,5));
data.setValue(4, 1, 41476);
data.setValue(4, 2, 66467);
data.setValue(4, 3, 56467);
data.setValue(5, 0, new Date(2008, 1 ,6));
data.setValue(5, 1, 33322);
data.setValue(5, 2, 39463);
data.setValue(5, 3, 29463);
var annotatedtimeline = new google.visualization.AnnotatedTimeLine(
document.getElementById('chart_div'));
annotatedtimeline.draw(data, {'displayAnnotations': true});
annotatedtimeline.hideDataColumns(3);
}
</script>
</head>
<body>
<div id='chart_div' style='width: 700px; height: 240px;'></div>
</body>
</html>
------------ end of code ---------------------
Alex
Feb 24, 2011, 9:15:16 AM2/24/11
to google-visua...@googlegroups.com
I'm having the same problem. I'm trying to hide two columns, one gets hidden but the other one doesn't. Did you get it to work?
Navot Oren
Feb 24, 2011, 9:56:08 AM2/24/11
to google-visua...@googlegroups.com
I didn't solve the problem. Instead I created dataview without the columns that I wanted to hide.
In case you will finally come up with a proper solution, I will be happy to hear.
On Thu, Feb 24, 2011 at 4:15 PM, Alex <alex.ir...@gmail.com> wrote:
I'm having the same problem. I'm trying to hide two columns, one gets hidden but the other one doesn't. Did you get it to work?
--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
lior grinfeld
Aug 21, 2011, 6:35:13 AM8/21/11
to google-visua...@googlegroups.com
Hi Oren,
can you publish your solution (code) ? i am facing the same issue , tried to do what you suggested but without success. your help will be greatly appreciated.
10X
,Lior
can you publish your solution (code) ? i am facing the same issue , tried to do what you suggested but without success. your help will be greatly appreciated.
10X
,Lior
Reply all
Reply to author
Forward
0 new messages