Cacher is the code snippet organizer for pro developers

{
  "$schema": "https://vega.github.io/schema/vega/v4.json",  
  "width": 900,
  "height": 434,
  "padding": {
    "top": 0,
    "right": 20,
    "bottom": 0,
    "left": 20
  },
  "data": [
    {
      "name": "voorland",
      "values": []
    },
    {
      "name": "dijk",
      "url": "https://tsws.hkvservices.nl/mangrove.ws/entry.asmx//Call?function=haas.appfunctions.GetProfielSchema&parameters={database:%27HR_Alblasserwaard%27,dijkpaalid:396,profielid:%27759%27}"
    },
    {
      "name": "ruw_profiel",
      "url": "https://tsws.hkvservices.nl/mangrove.ws/entry.asmx//Call?function=haas.appfunctions.GetBelasting&parameters={database:%27HR_Alblasserwaard%27,trajectid:1,bertype:0,zichtjaar:2015,profieltype:%27Werkelijk%20profiel%27,overslagdebiet:5,normtype:-1,terugkeertijd:10000}",
      "format": { "type": "json" }
    },
    { "name": "total", "source": ["voorland", "dijk", "ruw_profiel"] },
    {"name": "init_ydomain", "values": [{"null": 0}]}
  ],
  "scales": [
    {
      "name": "xscale",
      "type": "linear",
      "range": "width",
      "zero": true,
      "domain": { "data": "total", "field": "x" }
    },
    {
      "name": "yscale",
      "type": "linear",
      "range": "height",
      "nice": true,
      "zero": true,      
      "domain": {
        "fields": [
          {"data": "total", "field": "y"},
          {"data": "init_ydomain", "field": "null"}
        ]
      }
    }
  ],
  "axes": [
    {
      "orient": "bottom",
      "scale": "xscale",
      "tickCount": 10,
      "title": "Afstand [m]",
      "grid": true,
      "encode": {
        "grid": {
          "update": { "stroke": { "value": "#999" }, "strokeWidth": { "value": 0.1 } }
        },
        "ticks": { "update": { "stroke": { "value": "black" } } },
        "labels": {
          "update": {
            "fill": { "value": "black" },
            "angle": { "value": 0 },
            "fontSize": { "value": 12 }
          }
        },
        "title": { "update": { "fontSize": { "value": 14 } } },
        "domain": {
          "update": { "stroke": { "value": "black" }, "strokeWidth": { "value": 1 } }
        }
      }
    },
    {
      "orient": "left",
      "scale": "yscale",
      "tickCount": 6,
      "title": "Hoogte [m+NAP]",
      "grid": true,
      "encode": {
        "grid": {
          "update": { "stroke": { "value": "#999" }, "strokeWidth": { "value": 0.1 } }
        },
        "ticks": { "update": { "stroke": { "value": "black" } } },
        "labels": {
          "update": {
            "fill": { "value": "black" },
            "angle": { "value": 0 },
            "fontSize": { "value": 12 }
          }
        },
        "title": { "update": { "fontSize": { "value": 14 } } },
        "domain": {
          "update": { "stroke": { "value": "black" }, "strokeWidth": { "value": 1 } }
        }
      }
    }
  ],
  "marks": [
    {
      "type": "line",
      "interactive": false,
      "from": { "data": "voorland" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "stroke": { "value": "#ffcc66" },
          "strokeWidth": { "value": 2 }
        }
      }
    },
    {
      "type": "line",
      "interactive": false,
      "from": { "data": "dijk" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "stroke": { "value": "green" },
          "strokeWidth": { "value": 2 }
        }
      }
    },
    {
      "type": "line",
      "interactive": false,
      "from": { "data": "ruw_profiel" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "stroke": { "value": "black" },
          "strokeWidth": { "value": 0.5 }
        }
      }
    },
    {
      "type": "symbol",
      "from": { "data": "voorland" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "stroke": { "value": "#ffcc66" },
          "fill": { "value": "#ffcc66" },
          "strokeWidth": { "value": 1 }
        },
        "hover": {
          "strokeWidth": { "value": 5 },
          "stroke": { "value": "red" },
          "fill": { "value": "red" }
        }
      }
    },
    {
      "type": "symbol",
      "from": { "data": "dijk" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "stroke": { "value": "green" },
          "fill": { "value": "green" },
          "strokeWidth": { "value": 1 },
                "tooltip": {
                  "signal": "{'Afstand [m]': +format(datum.x, '.2f'), 'Hoogte [m+NAP]': format(datum.y, '.2f')}"
                }          
        },
        "hover": {
          "strokeWidth": { "value": 5 },
          "stroke": { "value": "red" },
          "fill": { "value": "red" }
        }
      }
    },
    {
      "type": "area",
      "interactive": false,
      "clip": true,
      "from": { "data": "voorland" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "y2": { "scale": "yscale", "value": -100 },
          "fill": { "value": "#ffff66" },
          "fillOpacity": { "value": 0.15 }
        }
      }
    },
    {
      "type": "area",
      "interactive": false,
      "clip": true,
      "from": { "data": "dijk" },
      "encode": {
        "update": {
          "x": { "scale": "xscale", "field": "x" },
          "y": { "scale": "yscale", "field": "y" },
          "y2": { "scale": "yscale", "value": -100 },
          "fill": { "value": "#1C991C" },
          "fillOpacity": { "value": 0.15 }
        }
      }
    }
  ]
}