improve graph scale and centering (#796)

* add gutter to embedding canvas

* improve layout scale and translate

* fix lint

* pin tables to version 3.5.1

* fix lasso coordinate smoke tests

client/__tests__/e2e/data.js

@@ -27,7 +27,7 @@ export const datasets = {
       lasso: [
         {
           "coordinates-as-percent": { x1: 0.05, y1: 0.25, x2: 0.15, y2: 0.35 },
-          count: "104"
+          count: "101"
         }
       ],
       categorical: [
@@ -91,8 +91,8 @@ export const datasets = {
         }
       },
       lasso: {
-        "coordinates-as-percent": { x1: 0.45, y1: 0.05, x2: 0.5, y2: 0.1 },
-        count: "76"
+        "coordinates-as-percent": { x1: 0.45, y1: 0.05, x2: 0.65, y2: 0.15 },
+        count: "46"
       }
     },
     scatter: {

client/src/components/graph/graph.js

@@ -146,9 +146,10 @@ class Graph extends React.Component {
     const sizeBuffer = regl.buffer();
 
     // preallocate coordinate system transformation between data and gl
+    const fractionToUse = 0.98; // fraction of dimension to use
     const transform = {
-      glScaleX: scaleLinear([0, 1], [-1, 1]),
-      glScaleY: scaleLinear([0, 1], [1, -1])
+      glScaleX: scaleLinear([0, 1], [-1 * fractionToUse, 1 * fractionToUse]),
+      glScaleY: scaleLinear([0, 1], [1 * fractionToUse, -1 * fractionToUse])
     };
 
     /* first time, but this duplicates above function, should be possile to avoid this */