How To Customize Angular Google Chart Legend Info
I have google chart (line chart), need to customize legend with some extra information. Please refer this http://plnkr.co/edit/ysZwYaAQpMhHarcA2UHq?p=preview [Plunker][1] to know
Solution 1:
to add the score to the legend,
you can add the score to the column label before drawing the chart
replace the drawChart
function with the following...
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;
}
}
}
Post a Comment for "How To Customize Angular Google Chart Legend Info"