Google Charts, ocultar la visualización de la columna, pero mantienen los datos subyacentes para su uso

Question

En el siguiente JSON:

 var data = new google.visualization.DataTable(
      { 
      cols: [{id: 'Option1', label: 'Manufacturer', type: 'string'}, 
        {id: 'Option2', label: 'Region', type: 'string'}, 
        {id: 'Option3', label: 'Option3', type: 'number'}, 
        {id: 'Option4', label: 'Option4', type: 'number'}, 
        {id: 'Option5', label: 'Option5', type: 'number'}, 
        {id: 'Option6', label: 'Option6', type: 'number'}, 
        {id: 'Option7', label: 'Option7', type: 'number'}, 
        {id: 'Option8', label: 'Option8', type: 'number'}], 


      rows: [{c:[{v: 'Ford'}, {v: 'South East'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'Ford'}, {v: 'South East'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'Ford'}, {v: 'South East'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'BMW'}, {v: 'South East'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'BMW'}, {v: 'North'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'BMW'}, {v: 'North'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'Citroen'}, {v: 'North'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]}, 
        {c:[{v: 'Citroen'}, {v: 'South East'}, {v: 2}, {v: 3}, {v: 4}, {v: 5}, {v: 6}, {v: 7}]} 
        ] 
      }, 
      0.6 
     ) 

mi gráfico de 'voluntad' mostrar los fabricantes como filas con 7 barras de datos contra cada uno.

Quiero ser capaz de filtrar los datos usando un control dependiente para ver solo las filas en cada región (columna 1).

En este momento, este gráfico no se dibuja porque la columna de la región no es un número entero y, por lo tanto, no se puede mostrar.

Por lo tanto, quiero 'ocultar' la columna de la región para que no se muestre como una barra, pero está disponible para su uso con el control dependiente.

¿Alguien puede ayudar con esto ya que no puedo encontrar ninguna manera de hacerlo? No creo que el método hideColumns funcione, ya que elimina la columna del objeto de datos y, por lo tanto, el control dependiente no puede verlo.

Answer 1

La solución a esto fue usar 'ver'.

 // Create a bar chart, passing some options 
     barChart = new google.visualization.ChartWrapper({ 
      'chartType': 'BarChart', 
      'containerId': 'chart_div', 
      'options': { 
      'width': '100%', 
      'height': '120%', 
      'vAxis': {title: "Branch"}, 
      'hAxis': {title: "Cups"}, 
      'fontSize': 14, 
      'showRowNumber' : true, 
      }, 
      'view': {'columns': [0,2,3,4,5,6,7]} 
     }); 

Esperemos que esto ayude a otras personas con el mismo problema.

Answer 2

Puede utilizar el DATAVIEW directamente como bien haciendo lo siguiente con su código

function hideColumns (chart, data, options, colToHide) { 
     dataview = new google.visualization.DataView(data); 
     dataview.hideColumns(colToHide); 
     // you can also use dataview.setColumns([1,2]) to show only selected columns and hide the rest 
     chart.draw(dataview, options) 
    };