Google Charts - Google Charts tutorial - trendlines charts - chart js - google graphs - google charts examples



What is Tredline Charts?

  • A trendline is a line superimposed on a chart to reveal the overall direction of the data.
  • Google Charts can automatically generate trendlines for Sankey Charts, Scatter Charts, Stepped area charts, Table, Timelines, TreeMap, Trendlines, Bar Charts, Column Charts, and Line Charts.

Linear trendlines:

  • A linear trendline is the straight line that most closely approximates the data in the chart. (To be precise, it's the line that minimizes the sum of squared distances from every point to it.)
  • In the chart below, you can see a linear trendline on a scatter chart comparing the age of sugar maples to the diameter of their trunks.
  • You can hover over the trendline to see the equation calculated by Google Charts: 4.885 times the diameter + 0.730.
  • To draw a trendline on a chart, use the trendlines option and specify which data series to use:

Sample code

google.charts.setOnLoadCallback(drawChart);
function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['Diameter', 'Age'],
    [8, 37], [4, 19.5], [11, 52], [4, 22], [3, 16.5], [6.5, 32.8], [14, 72]]);

  var options = {
    title: 'Age of sugar maples vs. trunk diameter, in inches',
    hAxis: {title: 'Diameter'},
    vAxis: {title: 'Age'},
    legend: 'none',
    trendlines: { 0: {} }    // Draw a trendline for data series 0.
  };

  var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}
Clicking "Copy Code" button to copy the code. From - google charts tutorial - team
  • Linear trendlines are the most common type of trendline. But sometimes a curve is best for describing data, and for that, we'll need another type of trendline.

Chart Type:

Sr. No. Chart Type / Description
1 Basic Trendlines Chart
2 Exponential Trendlines Chart
3 Polynomial Trendlines Chart

Related Searches to Google charts - trendlines charts