From b299ab7eeb1bea2dd99aaf17a78735d58514460c Mon Sep 17 00:00:00 2001
From: Jan Philipp Timme <jan.philipp@timme.it>
Date: Sun, 31 Dec 2017 00:19:51 +0100
Subject: [PATCH] Shuffle around, remove zoom rect temporarily

---
 js/diagrams.js | 37 +++++++++++++++++++++----------------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/js/diagrams.js b/js/diagrams.js
index 7da2a9d..7b506fb 100644
--- a/js/diagrams.js
+++ b/js/diagrams.js
@@ -63,7 +63,7 @@ function createLineGraph(containerId, raceData){
     .extent([[0, 0], [graphPosWidth.width, graphPosWidth.height]])
     .on("zoom", zoomed);
 
-// -----------------------------------------------------------------------
+  // -----------------------------------------------------------------------
 
   // defines how the passed in Data, at "svg.append" shall be interpreted
   var lineDataDefinition = d3.line()
@@ -80,7 +80,15 @@ function createLineGraph(containerId, raceData){
   var svg = d3.select(containerId).append("svg")
       .attr("width", svgWidth)
       .attr("height", svgHeight);
+
   //----------------------------------------------------------------------
+  /*svg.append("rect")
+      .attr("class", "zoom")
+      .attr("width", graphPosWidth.width)
+      .attr("height", graphPosWidth.height)
+      .attr("transform", "translate(" + graphPosWidth.posX + "," + graphPosWidth.posY + ")")
+      .call(zoom);*/
+
   svg.append("defs").append("clipPath")
     .attr("id", "clip")
     .append("rect")
@@ -98,6 +106,18 @@ function createLineGraph(containerId, raceData){
 
   // -----------------------------------------------------------------------
 
+  context.append("g")
+      .attr("class", "axis axis--x")
+      .attr("transform", "translate(0," + smallGraphPosWidth.height + ")")
+      .call(d3.axisBottom(x2));
+
+  context.append("g")
+      .attr("class", "brush")
+      .call(brush)
+      .call(brush.move, x.range());
+
+  // -----------------------------------------------------------------------
+
   // Scale the range of the data
   x.domain([0, raceData.lapTimes.size]);
   y.domain([raceData.drivers.length, 1]);
@@ -304,22 +324,7 @@ function createLineGraph(containerId, raceData){
 //----------------------------
 
 
-  context.append("g")
-      .attr("class", "axis axis--x")
-      .attr("transform", "translate(0," + smallGraphPosWidth.height + ")")
-      .call(d3.axisBottom(x2));
 
-  context.append("g")
-      .attr("class", "brush")
-      .call(brush)
-      .call(brush.move, x.range());
-
-  svg.append("rect")
-      .attr("class", "zoom")
-      .attr("width", graphPosWidth.width)
-      .attr("height", graphPosWidth.height)
-      .attr("transform", "translate(" + graphPosWidth.posX + "," + graphPosWidth.posY + ")")
-      .call(zoom);
 
   //---------------------------------------------------------------------------