add scrolling, update v

README.md

 # IFS Datavis Tool 2
-## v0.1.4
+## v0.1.5
 Contributors: Porter Libby
 
 [![GitHub issues](https://img.shields.io/github/issues/probably-not-porter/datavis)](https://github.com/probably-not-porter/datavis/issues)<br>

package.json

 {
   "name": "datavis",
-  "version": "0.2.4",
+  "version": "0.1.5",
   "description": "A tool for visualizing the data collected from the IFS Earlham trip",
   "main": "index.js",
   "scripts": {

public/js/graph.js

@@ -151,11 +151,38 @@ function addData(chart,times,data,types,color,title) {
     }
 
     chart = new Chart(document.getElementById("line-chart"), { // create new chart structure for streaming data
-        type: 'scatter',
+        type: 'line',
         data: {},
         options: {
             responsive: true,
             maintainAspectRatio: false,
+            plugins: {
+                zoom: {
+                    // Container for pan options
+                    pan: {
+                        enabled: true,
+                        mode: 'x',
+            
+                        // Function called while the user is panning
+                        onPan: function({chart}) { console.log(`I'm panning!!!`); },
+                        // Function called once panning is completed
+                        onPanComplete: function({chart}) { console.log(`I was panned!!!`); }
+                    },
+            
+                    // Container for zoom options
+                    zoom: {
+                        enabled: true,
+                        drag: false,
+                        mode: 'x',
+                        speed: 0.1,
+            
+                        // Function called while the user is zooming
+                        onZoom: function({chart}) { console.log(`I'm zooming!!!`); },
+                        // Function called once zooming is completed
+                        onZoomComplete: function({chart}) { console.log(`I was zoomed!!!`); }
+                    }
+                }
+            },
             title: {
                 display: true,
                 text: 'No Data Selected'

views/index.ejs

@@ -9,13 +9,17 @@
 
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.1"></script>
+        <script src="https://cdn.jsdelivr.net/npm/hammerjs@2.0.8"></script>
+        <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-zoom@0.7.4"></script>
         <script src="https://js.arcgis.com/4.12/"></script>
+
         <script type="text/javascript" src="js/map.js"></script>
         <script type="text/javascript" src="js/data.js"></script>
         <script type="text/javascript" src="js/graph.js"></script>
         <script type="text/javascript" src="js/main.js"></script>
         <script type="text/javascript" src="js/util.js"></script>
+        
         <link rel="stylesheet" type="text/css" href="css/main.css" />
         <link rel="stylesheet" type="text/css" href="css/graph.css" />
         <link rel="stylesheet" type="text/css" href="css/data.css" />
@@ -109,7 +113,7 @@
 
         <div id='dataView'>
             <div id='title'>
-                <span style='font-size:20px;'>IFS Datavis Tool v0.1.4</span><br>
+                <span style='font-size:20px;'>IFS Datavis Tool v0.1.5</span><br>
             </div>
             <div id='data'>
                 <div class='data-catagory' id='query_type'>