<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
<script>
google.charts.load('current', {
packages: ['corechart', 'bar']
});
google.charts.setOnLoadCallback(drawBasic);
function drawBasic() {
var data = google.visualization.arrayToDataTable([
['City', '2010 Population', { role: 'link' }],
['New York City, NY', 8175000, 'yout link'],
['Los Angeles, CA', 3792000, 'yout link'],
['Chicago, IL', 2695000, 'yout link'],
['Houston, TX', 2099000, 'yout link'],
['Philadelphia, PA', 1526000, 'yout link']
]);
var options = {
title: 'Population of Largest U.S. Cities',
chartArea: {
width: '50%'
},
hAxis: {
title: 'Total Population',
minValue: 0
},
vAxis: {
title: 'City'
}
};
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
google.visualization.events.addListener(chart, 'select', function (e) {
var selection = chart.getSelection();
if (selection.length) {
var row = selection[0].row;
let link = data.getValue(row, 2);
window.open(link,'_blank');
}
});
chart.draw(data, options);
}
</script>