do not show 0 value on google line chart

Question

        var data = google.visualization.arrayToDataTable([
          ['Year', 'Massachusetts', 'National'],
          ['2010',  88,  76],
          ['2011',  0,  82],
          ['2012',  96,  86],
          ['2013',  100,  91],
          ['2014',  0,  94],
          ['2015',  -1,  98],
          ['2016',  100,  99],
          ['2017',  124,  100],
          ['2018',  125,  102]
        ]);

This is the data I am using to create a line chart, I do not want to show 0's and negative values on the chart. I just want to skip these values.

my current chart looks like this

Expected chart is like this

Answer 1

we can use a data view with calculated columns,
to replace values less than or equal to zero with null

  var view = new google.visualization.DataView(data);
  var viewColumns = [0];
  for (var i = 1; i < data.getNumberOfColumns(); i++) {
    addViewColumn(i);
  }
  view.setColumns(viewColumns);

  function addViewColumn(columnIndex) {
    viewColumns.push({
      calc: function (dt, row) {
        var valNew = null;
        var valOrig = dt.getValue(row, columnIndex);
        if (valOrig > 0) {
          valNew = valOrig;
        }
        return valNew;
      },
      label: data.getColumnLabel(columnIndex),
      type: data.getColumnType(columnIndex)
    });
  }

then use the following configuration option, which skips null values

interpolateNulls: true

see following working snippet...

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['Year', 'Massachusetts', 'National'],
    ['2010',  88,  76],
    ['2011',  0,  82],
    ['2012',  96,  86],
    ['2013',  100,  91],
    ['2014',  0,  94],
    ['2015',  -1,  98],
    ['2016',  100,  99],
    ['2017',  124,  100],
    ['2018',  125,  102]
  ]);
  
  var view = new google.visualization.DataView(data);
  var viewColumns = [0];
  for (var i = 1; i < data.getNumberOfColumns(); i++) {
    addViewColumn(i);
  }
  view.setColumns(viewColumns);

  function addViewColumn(columnIndex) {
    viewColumns.push({
      calc: function (dt, row) {
        var valNew = null;
        var valOrig = dt.getValue(row, columnIndex);
        if (valOrig > 0) {
          valNew = valOrig;
        }
        return valNew;
      },
      label: data.getColumnLabel(columnIndex),
      type: data.getColumnType(columnIndex)
    });
  }

  var options = {
    title: 'Average Home Insurance Premium',
    interpolateNulls: true
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart'));
  chart.draw(view, options);
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>