chartArea4.json

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",

  "title": {
    "text": "Price distributions - pick an item",
    "subtitle":["Prices (£), colours set by decile for the 10th to 90th deciles"],
    "subtitleFontStyle":"italic",
    "subtitleFontSize":10,
    "subtitlePadding":5,
    "anchor": "start",
    "color": "black"
  },
  
  "width": 300, 
  "height": 300,
  
  "data": {"url": "https://raw.githubusercontent.com/RDeconomist/prices/master/analysis/newItems_Updated2024.csv"},

    "transform": [
      {"filter": {"selection": "chooseItem"}},
    {
      "filter": {
        "field": "price",
        "oneOf": ["10", "1020", "2030", "3040", "4050", "5060", "6070", "7080", "8090"]
      }
    }
  ],

"selection": {
    "chooseItem": {
      "type": "single",
      "init": {"itemName": "Pub meal"},
      "fields": ["itemName"],
      "bind": {
        "input": "select",
        "options": [
          "Cigarettes",
          "Lettuce",
          "Men's socks",
          "Pub meal"        
        ],
        "name": "Pick an item:"
      }
    }
  },
  
 
  "mark": {
    "type":"area",
    "orient":"vertical",
    "opacity": 0.7
  },
  
  "encoding": {  
    "x": {
      "field": "newDate",
      "type": "temporal",
      "title": null
    },
    "y": {
      "aggregate":"sum",
      "field": "p",
      "type": "quantitative",
      "title":null
    },
    "color": {
      "legend":null,
      "field": "price",
      "scale": {"range": [null, "#D9D9F3", "#00BFFF", "#0276FD", "#000080", "#000080", "#0276FD", "#00BFFF", "#D9D9F3" ]}
    },
    "order": {"field": "price"}
  },

  "resolve": {"scale": {"y": "independent"}}
}