I am trying to display two trend lines Using a ScatterChart visualization
with two trendlines, but nothing displays.
1. Is this even supported by the API?
2. If it is, what is wrong with my code?
Here's the code:
<html>
<head>
<title>Google Charts Tutorial</title>
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js";></script>
<script type="text/javascript"
src="https://www.google.com/jsapi";></script>
<script type="text/javascript">
google.charts.load('current', { 'packages': ['corechart'] });
</script>
</head>
<body>
<div id="emblem" style="width: 100%; height: 75px;"></div>
<div id="graph_container" style="width: 100%; height: 500px"></div>
<script language="JavaScript">
function drawChart()
{
// Define the chart to be drawn.
var data = new google.visualization.DataTable();
data.addColumn('number', 'Year');
data.addColumn('number', 'Rate');
data.addRows([
[2018, 9.60, 8.60],
[2019, 9.79, 8.79],
[2020, 10.08, 9.08],
[2021, 10.38, 9.38],
[2022, 10.69, 9.69]
]);
// Set chart options
var options =
{
title: 'Activity Rates',
hAxis: { title: 'Year', format:'0' },
vAxis: { title: 'Activity Rate' },
legend: 'none',
backgroundColor: 'transparent',
trendlines: { 0: { color: 'red' }, 1: { color: 'blue' } },
isStacked: true
};
// Instantiate and draw the chart.
var chart = new
google.visualization.ScatterChart(document.getElementById('graph_container'));
chart.draw(data, options);
}
google.charts.setOnLoadCallback(drawChart);
</script>
</body>
</html>
Thanks!!
--
You received this message because you are subscribed to the Google Groups
"Google Chart API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-chart-api/645691cc-e805-4916-bdf5-6f1c5d935b20%40googlegroups.com.
