Hi All,
I'm trying to create a line chart. It should have two lines that are dashed
and two lines that are solid. They are aggregations of my data. Also, I
have a control that is bound to the linechart so I am using a listener to
draw the chart when a selection is made.
I am using arrayToDataTable. To create the lines, I set up columns for
certainty in my data table, and then I used setColumnProperty to set the
role for those columns.
Now my question is,
a) have I done everything right so far?
b) how do I get the linechart to display the "uncertain" lines as dashed?
I'm not sure what code I need to use, or where to put it.
Many thanks in advance for your help!
Here is my code:
function drawVisualization() {
// Prepare the data
var data = google.visualization.arrayToDataTable([
["Program Number","Year","Total","Extended","Nat Median
Total","Certainty for Nat Median Total","Nat Median Extended","Certainty
for Nat Median Extended"],
["107000","2006",7852,6247,4598,false,1265,false],
["107000","2007",6523,6523,4598,false,1265,false],
["107000","2008",7413,3526,4598,false,1265,false],
["107000","2009",6821,1254,4598,false,1265,false],
["107000","2010",2354,9723,4598,false,1265,false],
["107000","2011",9762,3548,4598,false,1265,false],
["120000","2006",6824,4574,4598,false,1265,false],
["120000","2007",3258,2236,4598,false,1265,false],
["120000","2008",7496,4716,4598,false,1265,false],
["120000","2009",6899,3526,4598,false,1265,false],
["120000","2010",1547,8747,4598,false,1265,false],
["120000","2011",3587,7462,4598,false,1265,false]
]);
data.setColumnProperty(5, 'role', 'certainty');
data.setColumnProperty(7, 'role', 'certainty');
// Define a category picker control for the Program Number column
var chooseProgram = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'chooseprogram',
'options': {
'filterColumnLabel': 'Program Number',
'ui': {
'labelStacking': 'vertical',
'allowTyping': true,
'allowMultiple': false
}
}
});
////////
// Define a full table
var fullTable = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'fulltable',
'options': {'width': '90em'}
}
);
////////////////////////////
// Define a line chart
var casesLine = new google.visualization.ChartWrapper({
'chartType': 'LineChart',
'containerId': 'casesline',
'options': {
'width':600,
'height': 300,
'chartArea': {'left': 40, 'top': 15, 'right':7, 'bottom': 7},
'vAxis.minValue': 0
}
});
var casesMini = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'casesmini',
'options': {
'width': 600}
});
// Create a dashboard
new
google.visualization.Dashboard(document.getElementById('dashboard')).
// Establish bindings. The chooseProgram category picker will drive
both charts.
bind([chooseProgram], [fullTable]).
// Draw the entire dashboard.
draw(data);
//////////////
google.visualization.events.addListener(fullTable, 'ready',
function(event) {
casesLine.setDataTable(google.visualization.data.group(fullTable.getDataTable(),
[1], [{
'column': 2,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 3,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 4,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 6,
'aggregation': google.visualization.data.sum,
'type': 'number'
}]));
casesLine.draw();
casesMini.setDataTable(google.visualization.data.group(fullTable.getDataTable(),
[1], [{
'column': 2,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 3,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 4,
'aggregation': google.visualization.data.sum,
'type': 'number'
},{
'column': 6,
'aggregation': google.visualization.data.sum,
'type': 'number'
}]));
casesMini.draw();
});
}
google.load('visualization', '1', {packages:['corechart', 'controls',
'table'], callback: drawVisualization});
--
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.
