Skip to content Skip to sidebar Skip to footer

Prevent Default Sort Event In Google Chart Table

Is it possible to prevent default sort event from being fired in a google chart table object? If we take the example from code playground how could this be tweaked so as to e.g. pr

Solution 1:

Set the Table's sort option to event. This disables the default sorting and makes the chart throw a "sort" event when the headers are clicked. If you want to track sorting properly, you need to redraw the chart with the sortColumn and sortAscending options set:

var options = {
    sort: 'event'
};
google.visualization.events.addListener(table, 'sort', function(event) {
    if(event.column != 1) {
        options.sortColumn = event.column;
        options.sortAscending = event.ascending;
        sortData.sort([{column: event.column, desc: !event.ascending}]);
        table.draw(sortData, options);
    }
});

[edit - full code for function to use custom sorting for table, based on playground code]

function drawVisualization() {
    var options = {
        sort: 'event'
    };
    var table = new google.visualization.Table(document.getElementById('table'));
    table.draw(sortData, options);

    var chart = new google.visualization.BarChart(document.getElementById('chart'));
    chart.draw(sortData, null);

    google.visualization.events.addListener(table, 'sort', function(event) {
        if(event.column != 1) {
            options.sortColumn = event.column;
            options.sortAscending = event.ascending;
            sortData.sort([{column: event.column, desc: !event.ascending}]);
            table.draw(sortData, options);
        }
    });
}

Post a Comment for "Prevent Default Sort Event In Google Chart Table"