Format histogram axes: 200,000 --> 200k (#913)

* remove dead file

* tickformat

client/src/components/brushableHistogram/index.js

@@ -24,8 +24,8 @@ import { makeContinuousDimensionName } from "../../util/nameCreators";
 class HistogramBrush extends React.Component {
   static getColumn(world, field, clipped = true) {
     /*
-    Return the underlying Dataframe column for our field.   By default, 
+    Return the underlying Dataframe column for our field.   By default,
-    returns the clipped column.   If clipped===false, will return the 
+    returns the clipped column.   If clipped===false, will return the
     unclipped column.
     */
     const obsAnnotations = clipped
@@ -357,14 +357,24 @@ class HistogramBrush extends React.Component {
       .append("g")
       .attr("class", "axis axis--x")
       .attr("transform", `translate(0,${this.height - this.marginBottom})`)
-      .call(d3.axisBottom(x).ticks(5));
+      .call(
+        d3
+          .axisBottom(x)
+          .ticks(5)
+          .tickFormat(d3.format(".0s"))
+      );
 
     /* Y AXIS */
     svg
       .append("g")
       .attr("class", "axis axis--y")
       .attr("transform", `translate(${this.width - this.marginRight},0)`)
-      .call(d3.axisRight(y).ticks(3));
+      .call(
+        d3
+          .axisRight(y)
+          .ticks(3)
+          .tickFormat(d3.format(".0s"))
+      );
 
     /* axis style */
     svg.selectAll(".axis text").style("fill", "rgb(80,80,80)");
@@ -407,8 +417,8 @@ class HistogramBrush extends React.Component {
           isDiffExp
             ? "histogram-diffexp"
             : isUserDefined
-            ? "histogram-user-gene"
+              ? "histogram-user-gene"
-            : "histogram-continuous-metadata"
+              : "histogram-continuous-metadata"
         }
         style={{
           padding: globals.leftSidebarSectionPadding,

client/src/components/continuous/drawAxes.js

@@ -1,83 +0,0 @@
-// jshint esversion: 6
-import * as d3 from "d3";
-import styles from "./parallelCoordinates.css";
-import { yAxis, brushstart } from "./util";
-
-const drawAxes = (
-  svg,
-  ctx,
-  dimensions,
-  xscale,
-  height,
-  width,
-  handleBrushAction,
-  handleColorAction
-) => {
-  /*****************************************
-  ******************************************
-  Handles a brush event, toggling the display of foreground lines.
-  ******************************************
-  ******************************************/
-
-  function brush() {
-    const actives = [];
-    svg
-      .selectAll(".parcoords_axis .parcoords_brush")
-      .filter(() => d3.brushSelection(this))
-      .each(d => {
-        actives.push({
-          dimension: d,
-          extent: d3.brushSelection(this)
-        });
-      });
-    /* fire action, with selected dimensions & their values */
-    handleBrushAction(actives);
-  }
-
-  const axes = svg
-    .selectAll(".parcoords_axis")
-    .data(dimensions)
-    .enter()
-    .append("g")
-    .attr("class", `${styles.axis} parcoords_axis`)
-    .attr("transform", (d, i) => `translate(${xscale(i)})`);
-
-  axes
-    .append("g")
-    .each(d => {
-      const renderAxis =
-        "axis" in d
-          ? d.axis.scale(d.scale) // custom axis
-          : yAxis.scale(d.scale); // default axis
-      d3.select(this).call(renderAxis);
-    })
-    .append("text")
-    .on("click", d => {
-      handleColorAction(d.key);
-    })
-    .attr("class", styles.title)
-    .attr("text-anchor", "start")
-    .text(d => ("description" in d ? `${d.description}  🖌️` : `${d.key}  🖌️`));
-
-  // Add and store a brush for each axis.
-  axes
-    .append("g")
-    .attr("class", `${styles.brush} parcoords_brush`)
-    .each(d => {
-      d3.select(this).call(
-        (d.brush = d3
-          .brushY()
-          .extent([[-10, 0], [10, height]])
-          .on("start", brushstart)
-          .on("brush", brush)
-          .on("end", brush))
-      );
-    })
-    .selectAll("rect")
-    .attr("x", -8)
-    .attr("width", 16);
-
-  return axes;
-};
-
-export default drawAxes;