From a6fab08d5633d6e732ea105e913c146747167055 Mon Sep 17 00:00:00 2001
From: Matt Huntington <matt.huntington@gmail.com>
Date: Thu, 14 Sep 2017 09:35:17 -0400
Subject: [PATCH] scale axes when zooming

---
 app.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/app.js b/app.js
index 25ed118..29038a0 100644
--- a/app.js
+++ b/app.js
@@ -91,12 +91,14 @@ render();
 var bottomAxis = d3.axisBottom(xScale);
 d3.select('svg')
 	.append('g')
+    .attr('id', 'x-axis')
 	.call(bottomAxis)
     .attr('transform', 'translate(0,'+HEIGHT+')');
 
 var leftAxis = d3.axisLeft(yScale);
 d3.select('svg')
 	.append('g')
+    .attr('id', 'y-axis')
 	.call(leftAxis);
 
 var createTable = function(){
@@ -131,6 +133,8 @@ d3.select('svg').on('click', function(){
 
 var zoomCallback = function(){
 	d3.select('#points').attr("transform", d3.event.transform);
+    d3.select('#x-axis').call(bottomAxis.scale(d3.event.transform.rescaleX(xScale)));
+	d3.select('#y-axis').call(leftAxis.scale(d3.event.transform.rescaleY(yScale)));
 }
 var zoom = d3.zoom().on('zoom', zoomCallback);
 d3.select('svg').call(zoom);