barlinechart.json

{
  "width": 1000,
  "height": 200,
  "padding": {"top": 10, "left": 30, "bottom": 30, "right": 30},
  "data": [
    {
      "name": "stocks",
      "url": "data/stocks.csv",
      "format": {"type": "csv", "parse": {"price": "number"}},
      "transform": [{"type": "filter", "test": "d.data.symbol !== 'GOOG' "}]
    },
    {
      "name": "stocks2",
      "url": "data/stocks.csv",
      "format": {"type": "csv", "parse": {"price": "number"}},
      "transform": [{"type": "filter", "test": "d.data.symbol !== 'GOOG' "}]
    },
    {
      "name": "stats2",
      "source": "stocks2",
      "transform": [
        {"type": "facet", "keys": ["data.date"]},
        {"type": "stats", "value": "data.price"}
      ]
    }
  ],
  "scales": [
    {
      "name": "x",
      "type": "ordinal",
      "range": "width",
      "domain": {"data": "stocks2", "field": "data.date"}
    },
    {
      "name": "y",
      "type": "linear",
      "range": "height",
      "nice": true,
      "domain": {"data": "stocks", "field": "data.price"}
    },
    {
      "name": "y2",
      "type": "linear",
      "range": "height",
      "nice": true,
      "domain": {"data": "stats2", "field": "sum"}
    },
    {
      "name": "color",
      "type": "ordinal",
      "range": ["#3182bd", "#6baed6", "#9ecae1", "#c6dbef", "#e6550d"]
    },
    {
      "name": "color2",
      "type": "ordinal",
      "range": ["#637939", "#31a354", "#74c476", "#a1d99b", "#c7e9c0"]
    }
  ],
  "axes": [
    {"type": "x", "scale": "x"},
    {"type": "y", "scale": "y"},
    {"type": "y", "scale": "y2", "orient": "right"}
  ],
  "marks": [
    {
      "type": "group",
      "from": {
        "data": "stocks2",
        "transform": [
          {"type": "facet", "keys": ["data.symbol"]},
          {"type": "stack", "point": "data.date", "height": "data.price"}
        ]
      },
      "marks": [
        {
          "type": "rect",
          "properties": {
            "enter": {
              "x": {"scale": "x", "field": "data.date"},
              "width": {"scale": "x", "band": true, "offset": -1},
              "y": {"scale": "y2", "field": "y"},
              "y2": {"scale": "y2", "field": "y2"},
              "fill": {"scale": "color", "field": "data.symbol"}
            },
            "update": {
              "fillOpacity": {"value": 1}
            },
            "hover": {
              "fillOpacity": {"value": 0.5}
            }
          }
        }
      ]
    },
    {
      "type": "group",
      "from": {
        "data": "stocks",
        "transform": [{"type": "facet", "keys": ["data.symbol"]}]
      },
      "marks": [
        {
          "type": "line",
          "properties": {
            "enter": {
              "x": {"scale": "x", "field": "data.date"},
              "y": {"scale": "y", "field": "data.price"},
              "stroke": {"scale": "color2", "field": "data.symbol"},
              "strokeWidth": {"value": 2}
            },
            "update": {
              "strokeOpacity": {"value": 1}
            },
            "hover": {
              "strokeOpacity": {"value": 0.5}
            }
          }
        }
      ]
    }
  ]
}