range slider - All series on a given axis must be of the same data type -- error

[Missy]

Dear all, 

I have added a range slider to me line chart and when render the page, it displays - All series on a given axis must be of the same data type -- error.

    function drawVisualization(dataValues, chartTitle, columnNames, categoryCaption) {

        if (dataValues.length < 1)

            return;

        var data = new google.visualization.DataTable();

        data.addColumn('string', columnNames.split(',')[0]);

        data.addColumn('number', columnNames.split(',')[1]);

        data.addColumn('string', columnNames.split(',')[2]);

        data.addColumn('datetime', columnNames.split(',')[3]);

        data.addColumn('number', columnNames.split(',')[4]);

        for (var i = 0; i < dataValues.length; i++) {

            data.addRow([dataValues[i].ColumnName, dataValues[i].Value, dataValues[i].Type, date, dataValues[i].ID]);

            

        }

        // Create a date range slider  

        var myIdSlider = new google.visualization.ControlWrapper({  

        'controlType': 'ChartRangeFilter',  

        'containerId': 'control_div',  

        'options': {  

            'filterColumnLabel': columnNames.split(',')[4],

            'filterColumnIndex': '4',

            }  

          }); 

        new google.visualization.Dashboard(document.getElementById('PieChartExample')).bind([categoryPicker, stringFilter, myIdSlider], [pie]).draw(data);

    }

Any help much appreciated. 

Many thanks

[asgallant]

The ChartRangeFilter draws a LineChart internally, and you have to show that chart valid data.  Set the ChartRangeFilter's chartView.columns option to an array containing the columns to graph, eg:

chartView: {

    columns: [4, 5]

[Missy]

Hello, 

Thank you for your feedback and help.  I tried adding in the new option to the chartRangeSlider but I am still getting the same error.

        var myIdSlider = new google.visualization.ControlWrapper({  

        'controlType': 'ChartRangeFilter',  

        'containerId': 'control_div',  

        'options': {  

            'filterColumnLabel': columnNames.split(',')[4],

            'filterColumnIndex': '4',

            },

            'chartView': { 'columns': [4, 1] }

          });

As further reference, this is what my data looks like behind:

<script type="text/javascript">google.load('visualization','1.0',{'packages':['corechart','controls']});google.setOnLoadCallback(function(){drawVisualization([{"ColumnName":"WESTC","Value":72,"Type":"TALK","Date":"\/Date(1394582400000)\/","ID":538321},{"ColumnName":"SAYB","Value":98,"Type":"TK","Date":"\/Date(1394582400000)\/","ID":538320},{"ColumnName":"INDEP","Value":98,"Type":"TK","Date":"\/Date(1394582400000)\/","ID":538319},{"ColumnName":"GEMST","Value":4,"Type":"TK","Date":"\/Date(1394582400000)\/","ID":538318},{"ColumnName":"DASH2","Value":95,"Type":"TK","Date":"\/Date(1394582400000)\/","ID":538317}],'Text Example','Text Example','Text Example','Type,');});</script

Many thanks for your help and time.

[asgallant]

You put the chartView option in the wrong place, and you only need to specify one of "filterColumnIndex" or "filterColumnLabel".  It should be like this:

var myIdSlider = new google.visualization.ControlWrapper({  

    'controlType': 'ChartRangeFilter',  

    'containerId': 'control_div',  

    'options': {

        'filterColumnIndex': 4,

        'chartView': { 'columns': [4, 1] }

    }

});

[Missy]

Dear asgallant ,

Thank you for your response back.  I really appreciate your time and support, but I am sorry to inform, I still I am unable to solve the original error for the

'chartRangeSlider' control.  I originally added the code under options brackets, as you recently suggested but that did not work.  Then i added the code outside 

the option brackets, which you pointed out as incorrect. 

any help much appreciated. 

Thank you

[asgallant]

The charts you bind the controls to also have to have their columns set appropriately (via the ChartWrapper's view.columns parameter).  It is possible that one of those charts is throwing the error.

[Paul Fabbroni]

You need to put the chartView inside the ui object.  so it should be:

    'options': {

        'filterColumnIndex': 4,

        'ui': {'chartView': { 'columns': [4, 1] }}

    }