Google Chart Calendar - change value in gradient scale to string - charts

Question

I am using Google Chart Calendar and I would like to modify the gradient values - min and max. From the official documentation I can do it by modifying colorAxis:
{minValue: 0, maxValue: 5, colors: ['#FF0000', '#00FF00']}
But it supports only type number and I would prefer to indicate it by using string, something like "Lowest value" for minValue and "Highest value" for maxValue.
Any suggestions how can I do it?

Answer 1

in order to calculate the gradient on the 'Activity' column,
options for minValue and maxValue can only be numbers...
but if you just want to change the label that is displayed on the legend,
that can be done manually on the chart's 'ready' event
see following working snippet...
google.charts.load('current', {
packages: ['calendar']
}).then(function () {
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({type: 'date', id: 'Date'});
dataTable.addColumn({type: 'number', id: 'Activity'});
dataTable.addRows([
[new Date(2018, 0, 3), 1],
[new Date(2018, 0, 16), 2],
[new Date(2018, 1, 6), 3],
[new Date(2018, 1, 15), 4],
[new Date(2018, 1, 25), 5]
]);
var chart = new google.visualization.Calendar(document.getElementById('chart_div'));
var options = {
colorAxis: {minValue: 0, maxValue: 5, colors: ['#FF0000', '#00FF00']},
width: 1000
};
google.visualization.events.addListener(chart, 'ready', function () {
if ($('#chart_div text').length > 1) {
$($('#chart_div text').get(0)).text('Lowest');
$($('#chart_div text').get(1)).text('Highest');
}
});
chart.draw(dataTable, options);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>