{
  "$schema": "https://vega.github.io/schema/vega/v4.json",
  "width": 600,
  "height": 360,
  "autosize": "fit",
  "config": {
    "axisY": {
      "titleX": 25,
      "titleY": {
        "signal": "height + 30"
      },
      "titleAngle": 0,
      "titleAlign": "right",
      "titleBaseline": "top"
    }
  },
  "data": [
    {
      "name": "data_table",
      "url": "<%= dataset_url %>",
      "format": {
        "type": "csv"
      }
    },
    {
      "name": "fields",
      "values": [
        "Quarter1",
        "Quarter2",
        "Quarter3",
        "Quarter4"
      ]
    }
  ],
  "scales": [
    {
      "name": "ord",
      "type": "point",
      "range": "width",
      "round": true,
      "domain": {
        "data": "fields",
        "field": "data"
      }
    },
    {
      "name": "Quarter1",
      "type": "linear",
      "range": "height",
      "zero": false,
      "nice": true,
      "domain": {
        "data": "data_table",
        "field": "Quarter1"
      }
    },
    {
      "name": "Quarter2",
      "type": "linear",
      "range": "height",
      "zero": false,
      "nice": true,
      "domain": {
        "data": "data_table",
        "field": "Quarter2"
      }
    },
    {
      "name": "Quarter3",
      "type": "linear",
      "range": "height",
      "zero": false,
      "nice": true,
      "domain": {
        "data": "data_table",
        "field": "Quarter3"
      }
    },
    {
      "name": "Quarter4",
      "type": "linear",
      "range": "height",
      "zero": false,
      "nice": true,
      "domain": {
        "data": "data_table",
        "field": "Quarter4"
      }
    }
  ],
  "axes": [
    {
      "orient": "left",
      "zindex": 1,
      "scale": "Quarter1",
      "title": "Quarter 1",
      "offset": {
        "scale": "ord",
        "value": "Quarter1",
        "mult": -1
      },
      "ticks": false,
      "labels": false,
      "domain": false
    },
    {
      "orient": "left",
      "zindex": 1,
      "scale": "Quarter2",
      "title": "Quarter 2",
      "offset": {
        "scale": "ord",
        "value": "Quarter2",
        "mult": -1
      },
      "ticks": false,
      "labels": false,
      "domain": false
    },
    {
      "orient": "left",
      "zindex": 1,
      "scale": "Quarter3",
      "title": "Quarter 3",
      "offset": {
        "scale": "ord",
        "value": "Quarter3",
        "mult": -1
      },
      "ticks": false,
      "labels": false,
      "domain": false
    },
    {
      "orient": "left",
      "zindex": 1,
      "scale": "Quarter4",
      "title": "Quarter 4",
      "offset": {
        "scale": "ord",
        "value": "Quarter4",
        "mult": -1
      },
      "ticks": false,
      "labels": false,
      "domain": false
    }
  ],
  "marks": [
    {
      "name": "marks_group_lines",
      "type": "group",
      "from": {
        "data": "data_table"
      },
      "marks": [
        {
          "name": "marks_lines",
          "type": "line",
          "from": {
            "data": "fields"
          },
          "encode": {
            "update": {
              "x": {
                "scale": "ord",
                "field": "data"
              },
              "y": {
                "scale": {
                  "datum": "data"
                },
                "field": {
                  "parent": {
                    "datum": "data"
                  }
                }
              },
              "stroke": {
                "value": "#ccc"
              },
              "strokeOpacity": {
                "value": 0.3
              },
              "strokeWidth": {
                "signal": "(width+height)/200"
              }
            },
            "hover": {
              "stroke": {
                "value": "#7c7c7c"
              },
              "strokeOpacity": {
                "value": 1
              },
              "zindex": 99
            }
          }
        },
        {
          "name": "marks_symbols",
          "type": "symbol",
          "from": {
            "data": "fields"
          },
          "encode": {
            "enter": {
              "stroke": {
                "value": "#6D6D6D"
              },
              "strokeWidth": {
                "value": 1
              },
              "shape": {
                "value": "circle"
              }
            },
            "update": {
              "x": {
                "scale": "ord",
                "field": "data"
              },
              "y": {
                "scale": {
                  "datum": "data"
                },
                "field": {
                  "parent": {
                    "datum": "data"
                  }
                }
              },
              "size": {
                "signal": "width/2 + height/2"
              },
              "fill": {
                "value": "#77AE80"
              }
            },
            "hover": {
              "fill": {
                "value": "#AFD098"
              }
            }
          }
        }
      ]
    }
  ]
}