Hmm...combining this with the column selector makes this a bit more
challenging. As is, your column selector will show each data column twice
(since the column labels are duplicated for the second set of data), but
will always select only the first column with a given label. I assume that
you would want a selected column to draw both series associated with that
label, assigning one to the left axis and one to the right, correct? If
so, I'll have to think about how to make that happen. If not, then maybe
what you want is a variant of my axis selector
hack<http://jsfiddle.net/asgallant/STgLH/> (with
changes to make it select for left and right axes, with the data sets split
between the two).
On Thursday, February 14, 2013 10:28:46 AM UTC-5, Workaholic wrote:
>
> Thanks,
> I have joined the tables("joinTable.jpg"), but I'm having problems
> defining the series in the right way.
> My table is pivoted, so I'm not sure how exactly to do it.
> Can take a look at my code please?
> The function receives the joined table.
>
> function drawSecondChart(TwoDTable,visualDataSecondChart){
> var columnsTable = new google.visualization.DataTable();
> columnsTable.addColumn('number', 'colIndex');
> columnsTable.addColumn('string', 'colLabel');
> var initState = {
> selectedValues: []
> };
> for (var i = 1; i < TwoDTable.getNumberOfColumns(); i++) {
> columnsTable.addRow([i, TwoDTable.getColumnLabel(i)]);
> initState.selectedValues.push(TwoDTable.getColumnLabel(i));
> }
> labelsLength=columnsTable.getNumberOfRows();
>
> var chart = new google.visualization.ChartWrapper({
> chartType: 'LineChart',
> containerId: 'secondChart',
> dataTable: TwoDTable
> });
>
> var columnFilter = new google.visualization.ControlWrapper({
> controlType: 'CategoryFilter',
> containerId: 'stringFilterSecondChart',
> dataTable: columnsTable,
> options: {
> filterColumnLabel: 'colLabel',
> //values:columnIndices,
> ui: {
> label: '',
> allowTyping: false,
> allowMultiple: true,
> selectedValuesLayout: 'belowStacked'
> }
> },
> //state: {selectedValues: columnIndices}
> state: initState
> });
> if(firstTime==false){
> chart.setView({
> columns: columnIndices
> });
> var selectedLabels = new Array();
> for(var i=0; i<columnIndices.length; i++){
> selectedLabels.push(TwoDTable.getColumnLabel(columnIndices[i]));
> }
> columnFilter.setState({selectedValues: selectedLabels});
> }
>
> chart.draw();
> google.visualization.events.addListener(columnFilter, 'statechange',
> function () {
> firstTime=false;
> var state = columnFilter.getState();
> var row;
> columnIndices = [0];
> for (var i = 0; i < state.selectedValues.length; i++) {
> row = columnsTable.getFilteredRows([{
> column: 1,
> value: state.selectedValues[i]
> }])[0];
> columnIndices.push(columnsTable.getValue(row, 0));
> }
> // sort the indices into their original order
> columnIndices.sort(function (a, b) {
> return (a - b);
> });
> if(filteredMetricClicked){
> var indicesLength = columnIndices.length;
> for(var i=1; i<indicesLength; i++){
> columnIndices.push(columnIndices[i]+Math.ceil(labelsLength/2));
> }
> }
> chart.setView({
> columns: columnIndices
> });
> chart.draw();
> });
>
> columnFilter.draw();
> }
>
>
> On Thursday, February 14, 2013 10:34:36 AM UTC+2, Workaholic wrote:
>>
>> Hi,
>> I've 2 tables with the same labels as attached.
>> I've a chart displaying only one of them for now("chart.jpg").
>> Is it possible to mix them to one chart with two y axis, each displaying
>> different table?
>>
>> Thanks.
>>
>
--
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?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
