sorting in Gantt chart (Deneb/Vega-Lite)

[nailazubair]

Hi everyone,

I want to sort my Gantt chart based on a value. I have a column named [Loss] and I want to sort out my visual using this column. How can I achieve this?

In the attached file, we have 2 different types of Gantt charts and I want to sort them by [Loss] column. 

@giammariam I hope you can solve this easily as you have looked at it before 🙂

https://drive.google.com/file/d/1t7HCEmyh9PeoKwLeU_lWVW2ktLhfw4sI/view?usp=sharing

Kind Regards,

Naila

[giammariam]

@nailazubair, apologies for the delay on this. I created a calculated field that combines Sum of Loss with Block. Hope this helps. I start working on what you sent me via PM next.

If this is enough to get you going please consider liking this reply and choosing it as the solution. Otherwise, I'm happy to help further.

{
  "data": {
    "name": "dataset"
  },
  "params": [
    {
      "name": "text_horizontal_padding",
      "value": 10
    }
  ],
  "spacing": -50,
  "vconcat": [
    {
      "description": "dummy mark to generate x scale (concat_0_x) to be used later in spec and avoid cycle in graph",
      "mark": {
        "type": "bar",
        "opacity": 0
      },
      "width": 1200,
      "height": 0,
      "encoding": {
        "x": {
          "field": "StartDate_WeeklyChart",
          "type": "temporal",
          "axis": null,
          "timeUnit": "yearmonthdatehoursminutes",
          "timezone": "utc-0"
        },
        "x2": {
          "field": "EndDate_WeeklyChart",
          "type": "temporal",
          "timeUnit": "yearmonthdatehoursminutes",
          "timezone": "utc-0"
        }
      }
    },
    {
      "width": 1200,
      "height": {
        "step": 45
      },
      "transform": [
        {
          "calculate": "scale('concat_0_x', datum['StartDate'])",
          "as": "bar_x"
        },
        {
          "calculate": "scale('concat_0_x', datum['EndDate'])",
          "as": "bar_x2"
        },
        {
          "calculate": "datum['bar_x2']-datum['bar_x']-(2*text_horizontal_padding)",
          "as": "bar_width"
        },
        {
          "calculate": "toString(datum['Sum of Loss']) + '-' + datum['Block']",
          "as": "y_sort"
        }
      ],
      "encoding": {
        "x": {
          "field": "StartDate_WeeklyChart",
          "type": "temporal",
          "axis": {
            "title": false,
            "labelOverlap": false,
            "tickCount": {
              "interval": "day",
              "step": 1
            },
            "tickSize": 10,
            "orient": "top",
            "binSpacing": "15 minute",
            "format": "%A",
            "grid": true,
            "gridColor": "Black",
            "gridDash": [
              6,
              6
            ],
            "labelFontSize": 16
          },
          "timeUnit": "yearmonthdatehoursminutes",
          "timezone": "utc-0"
        },
        "x2": {
          "field": "EndDate_WeeklyChart",
          "type": "temporal",
          "timeUnit": "yearmonthdatehoursminutes",
          "timezone": "utc-0"
        },
        "tooltip": [
          {
            "title": "Block : ",
            "field": "Block",
            "type": "nominal"
          },
          {
            "title": "Start Date : ",
            "field": "StartDate",
            "type": "temporal",
            "format": "%Y-%m-%d %H:%M:%S"
          },
          {
            "title": "End Date : ",
            "field": "EndDate",
            "type": "temporal",
            "format": "%Y-%m-%d %H:%M:%S"
          },
          {
            "title": "Description : ",
            "field": "DESC",
            "type": "nominal"
          }
        ]
      },
      "layer": [
        {
          "mark": {
            "type": "bar",
            "tooltip": true,
            "align": "left",
            "cornerRadius": 10,
            "color": "#E8E8E8"
          },
          "encoding": {
            "y": {
              "field": "y_sort",
              "type": "nominal",
              "axis": {
                "labels": false
              }
            }
          }
        },
        {
          "mark": {
            "type": "text",
            "style": "label",
            "align": "left",
            "baseline": "middle",
            "dx": {
              "expr": "text_horizontal_padding"
            },
            "dy": -7,
            "color": "Black",
            "limit": {
              "expr": "datum['bar_width']"
            }
          },
          "encoding": {
            "y": {
              "field": "y_sort",
              "type": "nominal",
              "axis": {
                "labels": false
              }
            },
            "text": {
              "field": "Block",
              "type": "ordinal",
              "align": "center"
            }
          }
        },
        {
          "mark": {
            "type": "text",
            "style": "label",
            "align": "left",
            "baseline": "middle",
            "dx": {
              "expr": "text_horizontal_padding"
            },
            "dy": 7,
            "color": "Black",
            "limit": {
              "expr": "datum['bar_width']"
            }
          },
          "encoding": {
            "y": {
              "field": "y_sort",
              "type": "nominal",
              "axis": {
                "labels": false
              }
            },
            "text": {
              "field": "DataLabel",
              "type": "ordinal",
              "align": "left"
            }
          }
        }
      ]
    }
  ]
}