stocks_populate.json

{
  "schema": {
    "language": "vega",
    "version": "3.0"
  },
  "width": 500,
  "height": 300,
  "padding": 5,
  "signals": [
    { "name": "company", "value": "GOOG",
      "bind": {"input": "select", "options": ["GOOG", "MSFT"]} }
  ],  
  "data": [
    {
      "name": "source",
      "url": "data/stocks.csv",
      "format": {
        "type": "csv",
        "parse": {
          "date": "date",
          "price": "number",
          "company": "string"
        }
      },
      "transform": [
        {
          "type": "filter",
          "expr": "datum[\"date\"] !== null && !isNaN(datum[\"date\"]) && datum[\"price\"] !== null && !isNaN(datum[\"price\"])"
        },
        {
          "type": "filter",
          "expr": "datum.symbol===company"
        },
        {
          "type": "collect",
          "sort": {
            "field": "date",
            "order": "descending"
          }
        }
      ]
    }
  ],
  "marks": [
    {
      "type": "line",
      "from": {
        "data": "source"
      },
      "encode": {
        "enter": {
          "x": {
            "scale": "xscale",
                "field": "date"
          },
          "y": {
            "scale": "yscale",
                "field": "price"
          }
        }
      }
    }
  ],
  "scales": [
    {
      "name": "xscale",

          "type": "time",
          "domain": {
            "data": "source",
            "field": "date",
            "sort": {
              "field": "date",
              "op": "min"
            }
          },
      "range": "width"

    },
    {
      "name": "yscale",
      "type": "linear",
         "domain": {
            "data": "source",
            "field": "price"
         },
      "range": "height",
      "round": true,
      "nice": true
    }
  ],
  "axes": [
        {
          "scale": "xscale",
          "orient": "bottom",
          "tickCount": 5,
          "title": "date",
           "offset": 10,
          "zindex": 1,
          "encode": {
            "labels": {
              "update": {
                "text": {
                  "signal": "timeFormat(datum.value, '%b %d, %Y')"
                },
                "angle": {
                  "value": 270
                },
                "align": {
                  "value": "right"
                },
                "baseline": {
                  "value": "middle"
                }
              }
            }
          }
        },
        {
          "scale": "xscale",
          "domain": false,
          "labels": false,
           "offset": 10,
          "grid": true,
          "orient": "bottom",
          "ticks": false,
          "tickCount": 5,
          "zindex": 0,
          "gridScale": "yscale"
        },
    {
      "scale": "yscale",
      "format": "f",
      "orient": "left",
      "title": "price",
      "grid": true,
      "offset": 10,
      "zindex": 0
    }
  ]
}