Javascript 谷歌可视化错误

我有GoogleVisDataTable和仪表板（控制过滤器、字符串控制、datatable、图表）。所有元素都是绑定的

所以我从数据库JSON获取数据并发送到gViz api来绘制表、图表和控件。 当我使用contols过滤一些数据时，如果没有该字符串的数据，那么我会从google Visualization中得到如下错误：

一个或多个参与者未能绘制（）

表中没有行

以及类似的信息。所以在我的应用程序中，这太难看了，有没有办法不显示它？ 因此，如果没有数据不显示错误

我尝试使用CSS选项：

#google-visualization-errors-all-3{
显示：无；
}

但这对我来说不是个好办法

是否有其他方法，可能在谷歌可视化api的仪表板

更新：

var slider;
    var ajdi = '';
      function drawVisualization() {
        
       var cssClassNames = {
        'headerRow': 'zaglavlje',
        'tableRow': 'red',
        'oddTableRow': 'red1',
        'selectedTableRow': 'orange-background large-font',
        'hoverTableRow': 'prekoreda',
        'headerCell': 'gold-border',
        'tableCell': 'cell',
        'rowNumberCell': 'underline-blue-font'
    };

        
       var json = $.ajax({
                    url: 'getzadaci.php', // make this url point to the data file
                    dataType: 'json',
                    async: false
                }).responseText;
                
                // Create our data table out of JSON data loaded from server.
        var data = new google.visualization.DataTable(json);
        //dodajemo kolonu sa kontrolama
        
        
        
    
        
      
        // Define a category picker control for the Gender column
        var categoryPicker = new google.visualization.ControlWrapper({
          'controlType': 'CategoryFilter',
          'containerId': 'control1',
          'options': {
            'filterColumnLabel': 'Status',
            'ui': {
            'labelStacking': 'vertical',
              'allowTyping': false,
              'allowMultiple': true,
                          'caption': 'Status'

            }
          }
        });
        
         var categoryPicker1 = new google.visualization.ControlWrapper({
         'controlType': 'CategoryFilter',
          'containerId': 'control2',
          'options': {
            'filterColumnIndex': 8,
            'ui': {
            'labelStacking': 'horizontal',
              'allowTyping': false,
              'allowMultiple': true,
              'caption': 'Parcela'
            }
          }
        });
         var categoryPicker2 = new google.visualization.ControlWrapper({
         'controlType': 'CategoryFilter',
          'containerId': 'control4',
          'options': {
            'filterColumnIndex': 2,
            'ui': {
            'labelStacking': 'horizontal',
              'allowTyping': false,
              'allowMultiple': true,
              'caption': 'Vrsta zadatka'
            }
          }
        });
      
        
        var stringFilter1 = new google.visualization.ControlWrapper({
          'controlType': 'StringFilter',
          'containerId': 'control3',
          'options': {
                      'matchType': 'any',
          'filterColumnIndex': 1,
          'ui': {'labelStacking': 'vertical'}
          }
        });
        
        var slider = new google.visualization.ControlWrapper({
          'controlType': 'DateRangeFilter',
          'containerId': 'control5',
          'options': {
            'filterColumnLabel': 'Pocetak',
         'ui': {'labelStacking': 'vertical'}
          }
        });
      
        // Define a Pie chart
       
  
      
        // Define a table
        var table = new google.visualization.ChartWrapper({
          'chartType': 'Table',
          'containerId': 'chart2',
          'cssClassNames': 'cssClassNames',
          'view': { 'columns': [1,2,12,5,6,8,11] },
          'options': {
        cssClassNames: cssClassNames,
        allowHtml: true
    }
        });
        
       var timeline = new google.visualization.ChartWrapper({
    chartType: 'Timeline',
    containerId: 'chart5',
    options: {
    height: '350',
    timeline: { colorByRowLabel: true, 
                backgroundColor: '#ffd' },
    //timeline.barLabelStyle: {color: '#000', fontName: 'Arial', fontSize: '13px'},
    //backgroundColor: '#fff',
    colors: ['#55c2a2', '#89d168', '#d3eb87','#8ec63e', '#FFF0BA','#FF542E', '#CFD6DE', '#ADC1D6', '#7297BA']
    //timeline: { rowLabelStyle: {fontName: 'Helvetica', fontSize: 24, color: '#603913' },
               // barLabelStyle: { fontName: 'Garamond', fontSize: 14 } }
    },
    view: {
        // as an example, use columns "Naziv", "Vrsta", "Pocetak", and "Zavrsetak" for the timeline
        columns: [8, 2, 5, 6]
    },
    
});

           var formatter_short = new google.visualization.DateFormat({formatType: 'short'});
           formatter_short.format(data, 5);
           formatter_short.format(data, 6);

        
        new google.visualization.events.addListener(table, 'ready', function () {
        google.visualization.events.addListener(table.getChart(), 'select', function () {
            var selection = table.getChart().getSelection();
            // iterate over all selected rows
            for (var i = 0; i < selection.length; i++) {
              //$("#edit").removeClass("edit btn btn-success")
              //$('#edit').addClass('edit btn btn-success');
              ajdi = table.getDataTable().getValue(selection[i].row,0);
              $("#vrednostid").val(table.getDataTable().getValue(selection[i].row,0));
              $("#naziv1").val(table.getDataTable().getValue(selection[i].row,1));
              $("#vrsta_rada1").val(table.getDataTable().getValue(selection[i].row,2));
              $("#status1").val(table.getDataTable().getValue(selection[i].row,3));
              $("#opis1").val(table.getDataTable().getValue(selection[i].row,4));
              $("#usluzno1").val(table.getDataTable().getValue(selection[i].row,9));

              var p = new Date(table.getDataTable().getValue(selection[i].row,5));
              $("#dp31").datepicker("setDate", p);
              
              var z = new Date(table.getDataTable().getValue(selection[i].row,6));
              $("#dp41").datepicker("setDate", z);
              
              //$("#parcele1").val(table.getDataTable().getValue(selection[i].row,8));
              //$("#parcele1").select2("val", ["3","19"]);
              var id = table.getDataTable().getValue(selection[i].row,10);
              var naziv = table.getDataTable().getValue(selection[i].row,8);
              

var idArr = (id.lastIndexOf(',') == (id.length - 1) ? id.substr(0, id.length - 1) : id).split(', ');
var nazivArr = (naziv.lastIndexOf(',') == (naziv.length - 1) ? naziv.substr(0, naziv.length - 1) : naziv).split(', ');
var objHold = [];
for(var j=0,length=idArr.length;j<length;j++)
{
    if(idArr[j] && nazivArr[j]) // make sure both arrays have a value
    objHold.push({id: idArr[j], naziv: nazivArr[j]});
}
$("#parcele1").select2("data", objHold);

            }
        });
    });
        
        

      
        // Create a dashboard
        new google.visualization.Dashboard(document.getElementById('dashboard')).
            // Establish bindings, declaring the both the slider and the category
            // picker will drive both charts.
    bind([categoryPicker, categoryPicker1, categoryPicker2, slider, stringFilter1], [table, timeline]).
            // Draw the entire dashboard.
            draw(data, {'allowHtml':true, 'cssClassNames': 'cssClassNames'});      }
      //table.draw(data, {'allowHtml':true, 'cssClassNames': cssClassNames});      }

function dashboardReady() {
        // The dashboard is ready to accept interaction. Configure the buttons to
        // programmatically affect the dashboard when clicked.
      
        // Change the slider selected range when clicked.
        document.getElementById('rangeButton').onclick = function() {
          slider.setState({'lowValue': 2, 'highValue': 5});
          slider.draw();
        };
      
        // Change the pie chart rendering options when clicked.
        document.getElementById('optionsButton').onclick = function() {
          piechart.setOption('is3D', true);
          piechart.draw();
        };
      }
      


      google.setOnLoadCallback(drawVisualization);// JavaScript Document
      
     

var滑块；
var ajdi=“”；
函数drawVisualization（）{
变量cssClassNames={
“headerRow”：“zaglavlje”，
“tableRow”：“红色”，
'oddTableRow'：'red1'，
“selectedTableRow”：“橙色背景大字体”，
“hoverTableRow”：“prekoreda”，
“headerCell”：“黄金边界”，
“tableCell”：“cell”，
“rowNumberCell”：“下划线蓝色字体”
};
var json=$.ajax({
url:'getzadaci.php'，//使此url指向数据文件
数据类型：“json”，
异步：false
}).responseText；
//使用从服务器加载的JSON数据创建我们的数据表。
var data=new google.visualization.DataTable（json）；
//多达杰莫·科洛努·萨孔特罗拉马
//为“性别”列定义类别选择器控件
var categoryPicker=new google.visualization.ControlWrapper({
“controlType”：“CategoryFilter”，
“containerId”：“control1”，
“选项”：{
“filterColumnLabel”：“状态”，
“用户界面”：{
“标签固定”：“垂直”，
“allowTyping”：false，
“allowMultiple”：正确，
“标题”：“状态”
}
}
});
var categoryPicker1=新的google.visualization.ControlWrapper({
“controlType”：“CategoryFilter”，
“containerId”：“control2”，
“选项”：{
“filterColumnIndex”：8，
“用户界面”：{
“标签固定”：“水平”，
“allowTyping”：false，
“allowMultiple”：正确，
“标题”：“帕切拉”
}
}
});
var categoryPicker2=新的google.visualization.ControlWrapper({
“controlType”：“CategoryFilter”，
“containerId”：“control4”，
“选项”：{
“filterColumnIndex”：2，
“用户界面”：{
“标签固定”：“水平”，
“allowTyping”：false，
“allowMultiple”：正确，
“说明”：“Vrsta zadatka”
}
}
});
var stringFilter1=新的google.visualization.ControlWrapper({
“controlType”：“StringFilter”，
“containerId”：“control3”，
“选项”：{
'匹配类型'：'任何'，
“filterColumnIndex”：1，
'ui'：{'labelStacking'：'vertical'}
}
});
var slider=new google.visualization.ControlWrapper({
“controlType”：“DateRangeFilter”，
“containerId”：“control5”，
“选项”：{
'filterColumnLabel'：'Pocetak'，
'ui'：{'labelStacking'：'vertical'}
}
});
//定义饼图
//定义一个表
var table=new google.visualization.ChartWrapper({
“图表类型”：“表格”，
“集装箱运输”：“图表2”，
“cssClassNames”：“cssClassNames”，
'视图'：{'列'：[1,2,12,5,6,8,11]}，
“选项”：{
cssClassNames:cssClassNames，
allowHtml：是的
}
});
var timeline=new google.visualization.ChartWrapper({
图表类型：“时间线”，
集装箱运输：“chart5”，
选项：{
高度：'350'，
时间线：{colorByRowLabel:true，
背景色：'#ffd'}，
//timeline.barLabelStyle:{color:'#000'，fontName:'Arial'，fontSize:'13px'}，
//背景颜色：“#fff”，
颜色：[“#55c2a2”、“#89d168”、“#d3eb87”、“#8ec63e”、“#FFF0BA”、“#FF542E”、“#CFD6DE”、“#ADC1D6”、“#7297BA”]
//时间线：{rowLabelStyle:{fontName:'Helvetica'，fontSize:24，颜色：'#603913'}，
//barLabelStyle:{fontName:'Garamond'，fontSize:14}
},
视图：{
//例如，使用列“Naziv”、“Vrsta”、“Pocetak”和“Zavrsetak”作为时间线
栏目：[8、2、5、6]
},
});
var formatter_short=new google.visualization.DateFormat（{formatType:'short'}）；
格式化程序（数据，5）；
格式化程序（数据，6）；
新的google.visualization.events.addListener（表'ready'，函数（）{
google.visualization.events.addListener（table.getChart（），'select'，函数（）{
变量选择=table.getChart（）.getSelection（）；
//迭代所有选定行
对于（变量i=0；igoogle.visualization.events.addListener(chartWrapper, 'error', function (err) {
                                  google.visualization.errors.removeError(err.id);
                                });

// Gets rid of all Google's error messages
function removeGoogleErrors() {
  var id_root = "google-visualization-errors-all-";
    var index = 1;

    while (document.getElementById(id_root + index.toString()) != null) {
      document.getElementById(id_root + index.toString()).style.display = 'none';
      index += 2;
    } 
}