google charts - запустить функцию после рисования

Question

, работая с диаграммами Google, пытаясь получить значение из графика после того, как это сделано, я понимаю, что мне нужно сделать функцию обратного вызова, которая будет запускаться после завершения «рисования», но я не может заставить его работать ... Где я могу вызвать функцию afterDraw, чтобы она запускалась после завершения функции «draw»? Пожалуйста, помогите .. спасибо :)

google.charts.load('current', {'packages':['corechart']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
var data = new google.visualization.DataTable(); 
 
data.addColumn('string', 'Topping'); 
 
data.addColumn('number', 'Slices'); 
 
data.addColumn('number', 'Stam'); 
 
data.addRows([ 
 
    ['Mushrooms', 3,5], 
 
    ['Onions', 1,7], 
 
    ['Olives', 1,3], 
 
    ['Zucchini', 1,5], 
 
    ['Pepperoni', 2,8] 
 
]); 
 

 
var options = {'title':'How Much Pizza I Ate Last Night', 
 
       'height':500}; 
 

 
var chart = new google.visualization.ColumnChart(document.getElementById('chart_div')); 
 
chart.draw(data, options); 
 

 
} 
 
function afterDraw(){ 
 
    alert('all done'); 
 
}

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
 
<div id="chart_div"></div>

Answer 1

после того, как диаграмма создана и перед тем нарисовано,

добавить прослушиватель для события 'ready'

это даст вам знать, когда график был составлен

google.visualization.events.addListener(chart, 'ready', afterDraw); 

см следующий рабочий фрагмент кода ...

google.charts.load('current', {'packages':['corechart']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
var data = new google.visualization.DataTable(); 
 
data.addColumn('string', 'Topping'); 
 
data.addColumn('number', 'Slices'); 
 
data.addColumn('number', 'Stam'); 
 
data.addRows([ 
 
    ['Mushrooms', 3,5], 
 
    ['Onions', 1,7], 
 
    ['Olives', 1,3], 
 
    ['Zucchini', 1,5], 
 
    ['Pepperoni', 2,8] 
 
]); 
 

 
var options = {'title':'How Much Pizza I Ate Last Night', 
 
       'height':500}; 
 

 
var chart = new google.visualization.ColumnChart(document.getElementById('chart_div')); 
 

 
google.visualization.events.addListener(chart, 'ready', afterDraw); 
 

 
chart.draw(data, options); 
 

 
} 
 
function afterDraw(){ 
 
    console.log('all done'); 
 
}

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
 
<div id="chart_div"></div>