How to customize "not enough columns given to draw the requested chart" message?

Question

Is there any way to customize Google charts to prevent them from displaying this 'red' message? E.g., silently drawing nothing instead?

Answer 1

There is a bunch of events, methods and tools google charts / visualization offers for customizing error handling, error messages and so on.

For example, see https://developers.google.com/chart/interactive/docs/reference#errordisplay or https://developers.google.com/chart/interactive/docs/examples#querywrapper

According to what you are asking for, the easiest way would be to simply attach an errorhandler and in that handler, remove the error through google.visualization.errors.

Like this :

function errorHandler(errorMessage) {
    //curisosity, check out the error in the console
    console.log(errorMessage);

    //simply remove the error, the user never see it
    google.visualization.errors.removeError(errorMessage.id);
}

function drawChart(json) {
    var data = new google.visualization.DataTable(json); //here, JSON is buggy
    var options = {
      title: 'test'
    };
    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

    //attach the error handler here, before draw()
    google.visualization.events.addListener(chart, 'error', errorHandler);    

    chart.draw(data, options);
}

viola! Try add the errorHandler and google.visualization.events.addListener(chart, 'error', errorHandler); to your existing code, and see the difference (this is all you need).