Vega "table" using text marks

I'm trying to make a table in Vega using text mark, but I can't. I want to obtain as a result what I show in this image:

https://i.sstatic.net/xBL2d.png

I have seen the idea of what I want to do in a post that they use in Vega Lite and basically I want to pass it to Vega. The idea is the following:

A table is an arrangement of text in a grid. This chart uses text marks to show the units of data (in this case, numbers or strings in the dataset).

To begin, the vertical position of a mark ("row") should correspond to the row in the actual dataset, so we can use the "window" transform with the "row_number" operator in Vega-Lite to capture this explicitly.

The horizontal position of a mark ("column") should correspond to the attribute, which in this dataset is one of seven categorical options (beak length, beak depth, etc.). Capturing the attribute for each data unit is a little trickier, because we usually only work with one attribute at a time. However, here we can use the fold transform in Vega-Lite to "collapse" the data fields into two properties: key (the attribute) and value (the number or string). Row number is preserved as a field for each data unit, which is why we calculated it first.

To put it all together, we put our "row_num" field in the "y" encoding channel, the "value" field (generated by fold) in the "text" encoding channel, and the "key" field (also generated by fold) in the "x" encoding channel.

After some minor tweaks to the Vega-Lite for formatting purposes: orient x-axis on the top of the chart, remove default axis line and ticks, rotate axis labels, remove the grid border.

As you can see I have already done the transformations and I think the configuration of the x axis is correct, I think the error is in the y axis or the scales.

The code I have is the following:

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

  "width": 400,
  "height": 200,
  "padding": 5,

  "data": [
    {
      "name": "table",
      "url": "https://raw.githubusercontent.com/vega/vega-datasets/next/data/penguins.json",

      "transform": [
        

      {
     "type": "window",
     // "sort": {"field": "key", "order": "ascending"},
     "ops": ["row_number"],
     "fields": [null],
     "as": ["row_num"]
    },
    
     {"type": "fold", "fields": ["Beak Length (mm)", "Beak Depth (mm)"]}
 
      ]
    },
  
],



"scales": [
   {
      "name": "yscale",
      "type": "band",
      "domain": {"data": "table", "field": "row_num"},
       "range": "height",  
       

    }, 
 {
      "name": "xscale",
      "type": "band",
      "domain": {"data": "table", "field": "key"},
       "range": "width", 
       "padding": 15
    },

],

    "axes": [
    { 
      "orient": "top", 
      "scale": "xscale",
      "title": null,
      "domain": false,
      "ticks": false
    
    },
  ],


"marks": [

{
       "type": "text",
       "from": {"data": "table"},
       "encode": {
         "enter":{

          "y": {"scale": "yscale", "field": "row_num"},
          "y2": {"scale": "yscale", "value": 0},
          "text": {"field": "value", "type": "nominal"},           

           "x": {"scale": "xscale", "field": "key"},
          "width": {"scale": "xscale", "band": 1},
          }
        }
     },

]


}

I don't know what I'm missing or what I'm doing wrong. I thank you in advance for any help you could give me.

If you have a working version in Vega-Lite in the editor, just click the Compiled Vega button in the lower left corner. It will show you the Vega code.