Question

我有角度谷歌图表，每当用户点击删除R1按钮R1时，应该删除，当用户点击R2时，必须删除R2。在这里，我有[小提琴] [1]我尝试使用谷歌图表方法删除removeColumn（[＆＃39; r1＆＃39;]）像谷歌图表如何使用，但没有工作我需要方法来隐藏和显示angularjs谷歌中的列图表。如果您有任何想法，请告诉我。

[1]: http://jsfiddle.net/3crujkav/

Answer 1

使用复选框可能会更容易......

var data;
var colors = ['red', 'blue', 'green'];
$scope.$watch('datax', function(newValue, oldValue) {
  data = google.visualization.arrayToDataTable($scope.datax);
  colors.forEach(function (color, index) {
    data.setColumnProperty(index + 1, 'color', color);
  });
  drawChart();
}, true);

$scope.toggleCol = function() {
  drawChart();
}

function drawChart() {
  var chartColors = [];
  var chartColumns = [0];
  var view = new google.visualization.DataView(data);

  var checks = document.getElementsByTagName('input');
  for (var i = 0; i < checks.length; i++) {
    var seriesColumn = parseInt(checks[i].value);
    if (checks[i].checked) {
      chartColumns.push(seriesColumn);
      chartColors.push(data.getColumnProperty(seriesColumn, 'color'));
    }
  }
  view.setColumns(chartColumns);
  options.colors = chartColors;
  chart.draw(view, options);
}

请参阅forked fiddle

编辑

使用DataView将值列从字符串转换为数字...

var data;
var dataView;
$scope.$watch('datax', function(newValue, oldValue) {
  data = google.visualization.arrayToDataTable($scope.datax);
  dataView = new google.visualization.DataView(data);

  // convert string columns to number
  var viewColumns = [0];
  $.each(new Array(data.getNumberOfColumns()), function (colIndex) {
    // skip first column
    if (colIndex === 0) {
      return;
    }

    viewColumns.push({
      calc: function (dt, row) {
        return parseInt(dt.getValue(row, colIndex));
      },
      label: data.getColumnLabel(colIndex),
      type: data.getColumnType(colIndex)
    });
  });
  dataView.setColumns(viewColumns);


  drawChart();
}, true);

然后使用新的dataView完成绘图......

function drawChart() {
  var chartColors = [];
  var chartColumns = [0];

  // use dataView here
  var view = new google.visualization.DataView(dataView);
  ...

如何隐藏和显示Angularjs Google Chart中的列

1 个答案: