javascript - 如何自定义 Angular 谷歌图表图例信息

Question

我有谷歌图表(折线图)，需要用一些额外的信息来自定义图例。请引用此 http://plnkr.co/edit/ysZwYaAQpMhHarcA2UHq?p=preview [Plunker][1] 了解更多详情。我想要像下面这样的图例信息 snap

因此，如果您在下图中看到我的 fiddle ，我有 R1、R2、R3 等版本可供选择，每个版本都有自己的分数，所以我希望该分数显示为 R1 100，就像下图。请注意，图形数据不同，选择发布数据的下拉列表也不同。但两者都有 releaseId R1、R2。因此，在选择下拉值时，比如 R1、R2 或 R3，我只将该行从 graphdata 推送到 drawgraph。

所以基本上，我需要在图例中显示选定的 R1 分数。

请给我一些想法或链接，这是较早完成的。提前致谢。

Answer 1

将分数添加到图例中，
您可以在绘制图表之前将分数添加到列标签中

将 drawChart 函数替换为以下...

    function drawChart() {
        var chartColors = [];
        var chartColumns = [0];
        var checks = document.getElementsByTagName('input');
        for (var i = 0; i < $scope.selectedNewRelease.length; i++) {
            var seriesColumn = getColumnIndex(x, $scope.selectedNewRelease[i].releaseId);
            chartColumns.push(seriesColumn);
            x.setColumnLabel(seriesColumn, x.getColumnLabel(seriesColumn) + ' ' + $scope.selectedNewRelease[i].score);
        }
        var view = new google.visualization.DataView(x);
        view.setColumns(chartColumns);
        chart.draw(view, options);
          if ($scope.selectedNewRelease.length>0) {
                $scope.Grtgraph=true;
            }else{
                $scope.Grtgraph=false;
            }
    }

    function getColumnIndex(data, columnLabel) {
      for (var i = 0; i < data.getNumberOfColumns(); i++) {
        if (data.getColumnLabel(i) === columnLabel) {
          return i;
        }
      }
    }