{
  "name": "budgets",// name of the view
  "layout": {// layout object
    "composition": "single",// single view composition
    "width": 750,// the width of the entire view
    "height": 280,// the height of the entire view
    "row": [// row shelf
      {// first row element
        "field": "sector",// field name
        "sort": {// sort by
          "order": [// a specific order
            "Small-business aid",
            "Other measures",
            "Business tax breaks",
            "Stimulus checks",
            "Health care",
            "Unemployment benefits",
            "State and local aid",
            "Safety net and other tax cuts"
          ]
        }
      }
    ],
    "column": [// column shelf
      {// the irst column element
        "field": "plan",// field name
        "sort": {// sort by
          "order": [// a specific order
            "Republican plan",
            "Already passed",
            "Democratic plan"
          ]
        }
      },
      "amount"// the second column element (just by name)
    ]
  },
  "layer": [// layers
    {// the first layer
      "mark": {// mark type and properties
        "type": "bar",// mark type
        "color": {// mark color (fill) property
          "field": "plan",// providing a field name makes an encoding channel
          "scale": {// encoding scale details
            "domain": [// domain order
              "Republican plan",
              "Already passed",
              "Democratic plan"
            ],
            "range": [// mannual range (color) value
              "pink",
              "lightgray",
              "skyblue"
            ]
          }
        },
        "stroke": {// mark stroke color property
          "field": "plan",// details are as same as the color channel
          "scale": {
            "domain": [
              "Republican plan",
              "Already passed",
              "Democratic plan"
            ],
            "range": [
              "lightcoral",
              "gray",
              "dodgerblue"
            ]
          }
        }
      },
      "text": [// text elements
        {// the first text element
          "type": "on-axis",// axis labels; maps to the horizontal axis header
          "field": "plan",// field of the axis
          "anchor": "start",// text element anchoring (reference for positioning)
          "padding": 30,// offset from the visualization elements
          "items": [// text items, each item = each row
            {// the first text item, style details
              "align": "left",
              "fontSize": 14,
              "fontWeight": "700"
            },
            {// the second text item, style details
              "expression": "'$' + round(sum('amount') / 1000, 1) + ' trillion'",// particular expression (summary statistics--sum for 'amount' field) with text formatting
              "align": "left",
              "fontSize": 12,
              "fontWeight": "100"
            }
          ]
        },
        {// the second text element
          "type": "on-axis",// axis labels
          "field": "sector",// field of the axis; maps to the vertical axis
          "padding": 10,// offset from the visualization elements
          "items": [
            {
              "width": 100,
              "fontSize": 14,
              "fontWeight": 100,
              "align": "left"
            }
          ]
        },
        {// the third text elements
          "type": "on-mark",// mark labels
          "field": "amount",// field; for mark labels, it's reference field for label values
          "orient": "middle-right",// reference point to the mark objects
          "width": 85,// Set the width of each mark label
          "dx": 5,x position translate value
          "items": [
            {
              "fontSize": 13,
              "fontWeight": 200,
              "color": "#333333",
              "expression": "(isFirst('sector', datum) ? '$' + format(datum.value, ',d') + ' billion' : format(datum.value, ',d'))"// if it is the first item in terms of 'sector' field, then it has format of $,d billion; otherwise just ,d number format
            }
          ],
          "conditions": [// special conditions
            {
              "data": {// for the specified data point
                "plan": "Already passed",
                "amount": 1010
              },
              "options": {// change the following values
                "orient": "middle-left",// reference point to the mark object
                "anchor": {
                  "anchorAlign": "end"// reference point from the text object
                },
                "dx": -5// x position translate value
              }
            }
          ]
        }
      ]
    }
  ],
  "data": [// dataset for the visualization
    {
      "sector": "Small-business aid",
      "amount": 200,
      "plan": "Republican plan",
      "special_label": true
    },
    {
      "sector": "Small-business aid",
      "amount": 1010,
      "plan": "Already passed",
      "special_label": true
    },
    {
      "sector": "Small-business aid",
      "amount": 0,
      "plan": "Democratic plan",
      "special_label": true
    },
    {
      "sector": "Other measures",
      "amount": 81,
      "plan": "Republican plan"
    },
    {
      "sector": "Other measures",
      "amount": 627,
      "plan": "Already passed"
    },
    {
      "sector": "Other measures",
      "amount": 302,
      "plan": "Democratic plan"
    },
    {
      "sector": "Business tax breaks",
      "amount": 203,
      "plan": "Republican plan"
    },
    {
      "sector": "Business tax breaks",
      "amount": 346,
      "plan": "Already passed"
    },
    {
      "sector": "Business tax breaks",
      "amount": 36,
      "plan": "Democratic plan"
    },
    {
      "sector": "Stimulus checks",
      "amount": 300,
      "plan": "Republican plan"
    },
    {
      "sector": "Stimulus checks",
      "amount": 293,
      "plan": "Already passed"
    },
    {
      "sector": "Stimulus checks",
      "amount": 436,
      "plan": "Democratic plan"
    },
    {
      "sector": "Health care",
      "amount": 111,
      "plan": "Republican plan"
    },
    {
      "sector": "Health care",
      "amount": 277,
      "plan": "Already passed"
    },
    {
      "sector": "Health care",
      "amount": 382,
      "plan": "Democratic plan"
    },
    {
      "sector": "Unemployment benefits",
      "amount": 110,
      "plan": "Republican plan"
    },
    {
      "sector": "Unemployment benefits",
      "amount": 274,
      "plan": "Already passed"
    },
    {
      "sector": "Unemployment benefits",
      "amount": 437,
      "plan": "Democratic plan"
    },
    {
      "sector": "State and local aid",
      "amount": 105,
      "plan": "Republican plan"
    },
    {
      "sector": "State and local aid",
      "amount": 256,
      "plan": "Already passed"
    },
    {
      "sector": "State and local aid",
      "amount": 1118,
      "plan": "Democratic plan"
    },
    {
      "sector": "Safety net and other tax cuts",
      "amount": 18,
      "plan": "Republican plan"
    },
    {
      "sector": "Safety net and other tax cuts",
      "amount": 83,
      "plan": "Already passed"
    },
    {
      "sector": "Safety net and other tax cuts",
      "amount": 736,
      "plan": "Democratic plan"
    }
  ]
}