{
  "http": "https://github.com/vega/vega/wiki/Tutorial",
  "name": "dialog/delivery_reliability2/delivery_reliability_chart.json",
  "definition": {
    "padding": {
      "right": 30,
      "left": 50,
      "bottom": 0,
      "top": 20
    },
    "width": 960,
    "height": 440,
    "marks": [
      {
        "name": "bars",
        "type": "rect",
        "from": {
          "data": "table"
        },
        "properties": {
          "enter": {
            "y": {
              "field": "amount",
              "scale": "yscale"
            },
            "width": {
              "scale": "xscale",
              "offset": -1,
              "band": true
            },
            "y2": {
              "value": 0,
              "scale": "yscale"
            },
            "x": {
              "field": "category",
              "scale": "xscale"
            }
          },
          "update": {
            "opacity": {"value": 0.6},
            "fill": {
              "field": "category",
              "scale": "color"
            }
          },
          "hover": {
            "fill": {
              "field": "category",
              "scale": "hover_color"
            }
          }
        }
      },
      {
        "type": "text",
        "from": {
          "data": "table"
        },
        "properties": {
          "enter": {
            "x": {
              "field": "category",
              "scale": "xscale",
              "offset": 68
            },
            "y": {
              "field": "amount",
              "scale": "yscale",
              "offset": -7
            },
            "fill": {"value": "black"},
            "align": {"value": "center"},
            "baseline": {"value": "middle"},
            "text": {"field": "amount"}
          }
        }
      },
      {
        "type": "text",
        "properties": {
          "font": {"value": "Lato, sans-serif"},
          "fontSize": {"value": 18},
          "update": {
            "x": {
              "signal": "tooltip.category",
              "scale": "xscale"
            },
            "dx": {
              "scale": "xscale",
              "mult": 0.5,
              "band": true
            },
            "y": {
              "signal": "tooltip.amount",
              "scale": "yscale",
              "offset": -4
            },
            "fillOpacity": {
              "rule": [
                {
                  "predicate": {
                    "name": "tooltip",
                    "id": {
                      "value": null
                    }
                  },
                  "value": 0
                },
                {
                  "value": 1
                }
              ]
            },
            "text": {
              "signal": "tooltip.amount"
            }
          },
          "enter": {
            "align": {
              "value": "center"
            },
            "fill": {
              "value": "#333"
            }
          }
        }
      }
    ],
    "predicates": [
      {
        "type": "==",
        "operands": [
          {
            "signal": "tooltip._id"
          },
          {
            "arg": "id"
          }
        ],
        "name": "tooltip"
      }
    ],
    "data": [
      {
        "name": "table",
        "values": [
          {
            "category": "A",
            "amount": 28
          },
          {
            "category": "B",
            "amount": 55
          },
          {
            "category": "C",
            "amount": 43
          }
        ]
      }
    ],
    "signals": [
      {
        "init": [],
        "name": "tooltip",
        "streams": [
          {
            "type": "rect:mouseover",
            "expr": "datum"
          },
          {
            "type": "rect:mouseout",
            "expr": "{}"
          }
        ]
      }
    ],
    "scales": [
      {
        "type": "ordinal",
        "domain": {
          "data": "table",
          "field": "category"
        },
        "range": "width",
        "name": "xscale"
      },
      {
        "nice": true,
        "domain": {
          "data": "table",
          "field": "amount"
        },
        "range": "height",
        "name": "yscale"
      },
      {
        "type": "ordinal",
        "range": "category20",
        "name": "color",
        "domain": {
          "data": "table",
          "field": "category"
        }
      },
      {
        "name": "hover_color",
        "type": "ordinal",
        "range": [
          "blue",
          "6baed6",
          "9ecae1"
        ],
        "domain": {
          "data": "table",
          "field": "category"
        }
      }
    ],
    "axes": [
      {
        "type": "x",
        "scale": "xscale",
        "grid": false,
        "title": "Delivery difference (days)"
      },
      {
        "type": "y",
        "scale": "yscale",
        "grid": true
      }
    ]
  }
}
