google.charts.load('current', {packages:['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var rawData = [
['Dinosaur', 'Length'],
['Acrocanthosaurus (top-spined lizard)', 12.2],
['Albertosaurus (Alberta lizard)', 9.1],
['Allosaurus (other lizard)', 12.2],
['Apatosaurus (deceptive lizard)', 22.9],
['Archaeopteryx (ancient wing)', 0.9],
['Argentinosaurus (Argentina lizard)', 36.6],
['Baryonyx (heavy claws)', 9.1],
['Brachiosaurus (arm lizard)', 30.5],
['Ceratosaurus (horned lizard)', 6.1],
['Coelophysis (hollow form)', 2.7],
['Compsognathus (elegant jaw)', 0.9],
['Deinonychus (terrible claw)', 2.7],
['Diplodocus (double beam)', 27.1],
['Dromicelomimus (emu mimic)', 3.4],
['Gallimimus (fowl mimic)', 5.5],
['Mamenchisaurus (Mamenchi lizard)', 21.0],
['Megalosaurus (big lizard)', 7.9],
['Microvenator (small hunter)', 1.2],
['Ornithomimus (bird mimic)', 4.6],
['Oviraptor (egg robber)', 1.5],
['Plateosaurus (flat lizard)', 7.9],
['Sauronithoides (narrow-clawed lizard)', 2.0],
['Seismosaurus (tremor lizard)', 45.7],
['Spinosaurus (spiny lizard)', 12.2],
['Supersaurus (super lizard)', 30.5],
['Tyrannosaurus (tyrant lizard)', 15.2],
['Ultrasaurus (ultra lizard)', 30.5],
['Velociraptor (swift robber)', 1.8]
];
// sort data by 'Length'
var data = google.visualization.arrayToDataTable(rawData);
data.sort([{column: 1}]);
// find data row to highlight
var highlightRows = data.getFilteredRows([{
column: 0,
value: 'Ultrasaurus (ultra lizard)'
}]);
var options = {
colors: ['#3366cc', '#dc3912'], // <-- 1st color used to identify, 2nd to highlight
title: 'Lengths of dinosaurs, in meters',
legend: { position: 'none' },
histogram: { bucketSize: rawData.length / 10}
};
var container = document.getElementById('chart_div');
var chart = new google.visualization.Histogram(container);
google.visualization.events.addListener(chart, 'ready', function () {
var observer = new MutationObserver(function () {
var index = 0;
Array.prototype.forEach.call(container.getElementsByTagName('rect'), function (rect) {
if (options.colors.indexOf(rect.getAttribute('fill')) > -1) {
if (highlightRows.indexOf(index) > -1) {
rect.setAttribute('fill', options.colors[1]);
}
index++;
}
});
});
observer.observe(container, {
childList: true,
subtree: true
});
});
chart.draw(data, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>