How to get legends paging information in google charts? - google-visualization

Question

I need to get paging information of the legends. As shown in below image we have paging for legends.so, we need to get current selected page and number of page information.
click here for image

Answer 1

since there are no configuration options,
you'll have to inspect the SVG element which contains the information,
once the 'ready' event fires
see following working snippet...
google.charts.load('current', {
callback: function () {
var container = document.getElementById('chart_div');
var chart = new google.visualization.PieChart(container);
var message = document.getElementById('msg_div');
google.visualization.events.addListener(chart, 'ready', getLegendPage);
google.visualization.events.addListener(chart, 'select', getLegendPage);
function getLegendPage() {
Array.prototype.forEach.call(container.getElementsByTagName('text'), function(text) {
if (text.getAttribute('text-anchor') === 'middle') {
var legendPages = text.innerHTML.split('/');
message.innerHTML = 'Selected Legend page is ' + legendPages[0] + ' of ' + legendPages[1];
}
});
}
chart.draw(google.visualization.arrayToDataTable([
['Task', 'Hours'],
['A', 19.2],
['B', 30.8],
['C', 50.0],
['D', 19.2],
['E', 30.8],
['F', 50.0],
['G', 19.2],
['H', 30.8],
['I', 50.0],
['J', 19.2],
['K', 30.8],
['L', 50.0],
['M', 19.2],
['N', 30.8],
['O', 50.0]
]), {
height: 400,
chartArea: {
top: 24
},
legend: 'top',
pieHole: 0.4,
width: 400
});
},
packages: ['corechart']
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
<div id="msg_div"></div>