Add preliminary support for vega lite

[saulshanabrook]

Part of #4

This adds supports for vega lite rendering in mapd, by first converting to vega. I have added another cell magic to render yaml as vega lite to test out this feature.

It isn't working, because mapd fails to render the vega that is produced by vega lite.

lab:1 Uncaught (in promise) Exception: /home/jenkins-slave/workspace/mapd2-multi/compiler/gcc/gpu/cuda/host/centos/render/render/QueryRenderer/Data/Transforms/FormulaXform.cpp:169 JSON parse error [userId: lMDSid0Nygu6REEuoMP42ii8tvSDNpiQ, widgetId: 2] obj: {"type":"formula","expr":"toNumber(datum[\"x\"])","as":"x"}: Formula transform objects only currently support expressions run against other transform data table inputs. The input data table is of type SQLQUERY.

In the renderer.ipynb I try to render this vega lite:

{
 "width": 384,
 "height": 564,
 "data": {
  "name": "mapd_data"
 },
 "mark": "circle",
 "encoding": {
  "x": {
   "field": "x",
   "type": "quantitative"
  },
  "y": {
   "field": "y",
   "type": "quantitative"
  }
 }
}

it translates to this vega:

{
 "$schema": "https://vega.github.io/schema/vega/v3.0.json",
 "autosize": "pad",
 "padding": 5,
 "width": 384,
 "height": 564,
 "style": "cell",
 "data": [
  {
   "name": "mapd_data",
   "sql": "SELECT goog_x as x, goog_y as y, tweets_nov_feb.rowid FROM tweets_nov_feb"
  },
  {
   "name": "data_0",
   "source": "mapd_data",
   "transform": [
    {
     "type": "formula",
     "expr": "toNumber(datum[\"x\"])",
     "as": "x"
    },
    {
     "type": "formula",
     "expr": "toNumber(datum[\"y\"])",
     "as": "y"
    }
   ]
  }
 ],
 "marks": [
  {
   "name": "marks",
   "type": "symbol",
   "style": [
    "circle"
   ],
   "from": {
    "data": "data_0"
   },
   "encode": {
    "update": {
     "opacity": {
      "value": 0.7
     },
     "fill": {
      "value": "#4c78a8"
     },
     "x": {
      "scale": "x",
      "field": "x"
     },
     "y": {
      "scale": "y",
      "field": "y"
     },
     "shape": {
      "value": "circle"
     }
    }
   }
  }
 ],
 "scales": [
  {
   "name": "x",
   "type": "linear",
   "domain": {
    "data": "data_0",
    "field": "x"
   },
   "range": [
    0,
    {
     "signal": "width"
    }
   ],
   "nice": true,
   "zero": true
  },
  {
   "name": "y",
   "type": "linear",
   "domain": {
    "data": "data_0",
    "field": "y"
   },
   "range": [
    {
     "signal": "height"
    },
    0
   ],
   "nice": true,
   "zero": true
  }
 ],
 "axes": [
  {
   "scale": "x",
   "orient": "bottom",
   "title": "x",
   "labelFlush": true,
   "labelOverlap": true,
   "tickCount": {
    "signal": "ceil(width/40)"
   },
   "zindex": 1
  },
  {
   "scale": "x",
   "orient": "bottom",
   "grid": true,
   "tickCount": {
    "signal": "ceil(width/40)"
   },
   "gridScale": "y",
   "domain": false,
   "labels": false,
   "maxExtent": 0,
   "minExtent": 0,
   "ticks": false,
   "zindex": 0
  },
  {
   "scale": "y",
   "orient": "left",
   "title": "y",
   "labelOverlap": true,
   "tickCount": {
    "signal": "ceil(height/40)"
   },
   "zindex": 1
  },
  {
   "scale": "y",
   "orient": "left",
   "grid": true,
   "tickCount": {
    "signal": "ceil(height/40)"
   },
   "gridScale": "x",
   "domain": false,
   "labels": false,
   "maxExtent": 0,
   "minExtent": 0,
   "ticks": false,
   "zindex": 0
  }
 ],
 "config": {
  "axisY": {
   "minExtent": 30
  }
 }
}

[saulshanabrook]

Ah I see that in the mapd reference:

Note: Currently, expressions can only be performed against outputs (as values) from prior aggregate transforms.

Here we are performing a formula expression against a new aggregate transform. So we either need to find a way to get compile a vega schema without those transforms or add support for this type of transform to mapd (probably hard).

[saulshanabrook]

I removed that formula expression manually and now we are hitting another error:

Exception: /home/jenkins-slave/workspace/mapd2-multi/compiler/gcc/gpu/cuda/host/centos/render/render/QueryRenderer/Marks/../Scales/ScaleDomainRangeData.h:277 JSON parse error [userId: 1Mggk9m8fRTE3JvNgN3P8R12Sa2cSnyN, widgetId: 1] obj: {"data":"data_0","field":"x"}: scale data references only support JSON-embedded or sourced data tables currently.

For this vega spec:

 {
  "$schema": "https://vega.github.io/schema/vega/v3.0.json",
  "autosize": "none",
  "padding": 5,
  "width": 200,
  "height": 400,
  "style": "cell",
  "data": [
    {
      "name": "data_0",
      "sql": "SELECT goog_x as x, goog_y as y, tweets_nov_feb.rowid FROM tweets_nov_feb"
    }
  ],
  "marks": [
    {
      "name": "marks",
      "type": "symbol",
      "style": [
        "circle"
      ],
      "from": {
        "data": "data_0"
      },
      "encode": {
        "update": {
          "opacity": {
            "value": 0.7
          },
          "fill": {
            "value": "#4c78a8"
          },
          "x": {
            "scale": "x",
            "field": "x"
          },
          "y": {
            "scale": "y",
            "field": "y"
          },
          "shape": {
            "value": "circle"
          }
        }
      }
    }
  ],
  "scales": [
    {
      "name": "x",
      "type": "linear",
      "domain": {
        "data": "data_0",
        "field": "x"
      },
      "range": [
        0,
        200
      ],
      "nice": true,
      "zero": true
    },
    {
      "name": "y",
      "type": "linear",
      "domain": {
        "data": "data_0",
        "field": "y"
      },
      "range": [
        0,
        200
      ],
      "nice": true,
      "zero": true
    }
  ],
  "axes": [
    {
      "scale": "x",
      "orient": "bottom",
      "title": "x",
      "labelFlush": true,
      "labelOverlap": true,
      "tickCount": {
        "signal": "ceil(width/40)"
      },
      "zindex": 1
    },
    {
      "scale": "x",
      "orient": "bottom",
      "grid": true,
      "tickCount": {
        "signal": "ceil(width/40)"
      },
      "gridScale": "y",
      "domain": false,
      "labels": false,
      "maxExtent": 0,
      "minExtent": 0,
      "ticks": false,
      "zindex": 0
    },
    {
      "scale": "y",
      "orient": "left",
      "title": "y",
      "labelOverlap": true,
      "tickCount": {
        "signal": "ceil(height/40)"
      },
      "zindex": 1
    },
    {
      "scale": "y",
      "orient": "left",
      "grid": true,
      "tickCount": {
        "signal": "ceil(height/40)"
      },
      "gridScale": "x",
      "domain": false,
      "labels": false,
      "maxExtent": 0,
      "minExtent": 0,
      "ticks": false,
      "zindex": 0
    }
  ],
  "config": {
    "axisY": {
      "minExtent": 30
    },
    "ticks": false
  }
}

[saulshanabrook]

I opened vega/altair#843 for some better altair integration, but we should be able to get by without it for now