#!/usr/local/bin/perl -w
 use strict;
 use Template;
 use DateTime;
 use YAML qw( Load );

 my $tmpl   = Template->new;
 my $data   = join "", <DATA>;
 my $points = Load( join "", <> );

 my $tracks = "";

 for my $point ( @$points ) {
   my $dt = DateTime->from_epoch(
     epoch => $point->{ time } );
   $dt->set_time_zone( "local" );

   $tracks .= ", " if length $tracks;

   $tracks .= sprintf "[[%d, %d, %d], %d]",
     $dt->hour, $dt->minute, $dt->second,
     int( $point->{ ele } );
 }

 $tmpl->process( \$data,
   { tracks => $tracks } ) or
   die $tmpl->error();

 __DATA__
 <!DOCTYPE html>
 <html>
 <head>
 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
 <script>
 google.charts.load('current', {packages: ['corechart', 'line']});
 google.charts.setOnLoadCallback(drawBasic);

 function drawBasic() {

 var data = new google.visualization.DataTable();
   data.addColumn('timeofday', 'Time of Day');
   data.addColumn('number', 'Elevation');

   data.addRows([ [% tracks %] ] );

   var options = {
     hAxis: {
       title: 'Time',
         format: 'HH:mm',
         gridlines: {count: 10}
       },
       vAxis: {
         title: 'Elevation (feet)'
       }
     };

     var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

     chart.draw(data, options);
 }
 </script>

 </head>
 <body>
 <div id="chart_div"></div>
 </body>
 </html>