line and cluster bar

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "usermeta": {
    "deneb": {
      "build": "1.1.0.20220119#7e76f47",
      "metaVersion": 1,
      "provider": "vegaLite",
      "providerVersion": "5.2.0"
    },
    "interactivity": {
      "tooltip": true,
      "contextMenu": true,
      "selection": false,
      "dataPointLimit": 50
    },
    "information": {
      "name": "Line and clustered Column chart ",
      "description": "Works with deneb based on 5.2 (beta Version)",
      "author": "Mimoune djouallah",
      "uuid": "ff81d36f-a5ae-4486-97fe-4db57e0d126d",
      "generated": "2022-01-31T00:27:29.909Z"
    },
    "dataset": [
      {
        "key": "__0__",
        "name": "Month",
        "description": "Date (Week, Month, day etc)",
        "type": "dateTime",
        "kind": "column",
        "namePlaceholder": "Month"
      },
      {
        "key": "__1__",
        "name": "Project_id",
        "description": "category",
        "type": "text",
        "kind": "column",
        "namePlaceholder": "Project_id"
      },
      {
        "key": "__2__",
        "name": "Planned_Cumulative",
        "description": "Measure for Line Chart",
        "type": "numeric",
        "kind": "measure",
        "namePlaceholder": "Planned_Cumulative"
      },
      {
        "key": "__3__",
        "name": "Planned_Period",
        "description": "Measure for Bar",
        "type": "numeric",
        "kind": "measure",
        "namePlaceholder": "Planned_Period"
      }
    ]
  },
  "config": {
    "autosize": {
      "type": "fit",
      "contains": "padding"
    },
    "legend": {
      "orient": "top",
      "layout": {
        "top": {"anchor": "middle"}
      }
    }
  },
  "data": {"name": "dataset"},
  "layer": [
    {
      "mark": {
        "type": "bar",
        "tooltip": true
      },
      "encoding": {
        "y": {
          "field": "__3__",
          "type": "quantitative",
          "axis": {
            "title": null,
            "format": ".00%"
          }
        },
        "color": {
          "field": "__1__",
          "type": "nominal"
        },
        "x": {
          "field": "__0__",
          "type": "nominal",
          "axis": null
        },
        "xOffset": {"field": "__1__"},
        "opacity": {
          "condition": {
            "test": {
              "field": "__selected__",
              "equal": "off"
            },
            "value": 0.3
          }
        }
      }
    },
    {
      "mark": {
        "type": "line",
        "tooltip": true
      },
      "encoding": {
        "y": {
          "field": "__2__",
          "type": "quantitative",
          "scale": {"domain": [0, 1]},
          "axis": {
            "title": null,
            "format": ".00%"
          }
        },
        "x": {
          "field": "__0__",
          "type": "nominal",
          "axis": null
        },
        "color": {
          "field": "__1__",
          "type": "nominal"
        },
        "opacity": {
          "condition": {
            "test": {
              "field": "__selected__",
              "equal": "off"
            },
            "value": 0.3
          }
        }
      }
    }
  ],
  "resolve": {
    "scale": {"y": "independent"}
  }
}