Loading Isometric (Staggered) Map Data from Tiled JSON into Unity

Question

I have created an isometric (staggered) map in Tiled and exported the map data as a JSON file. Now, I'm trying to load the map data in Unity using C# and display it as an isometric (staggered) tile map. However, my current implementation loads the map as a diamond shape instead of an overall rectangular shape.

I'm using the following code to load the map data:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Tilemaps;
using System.IO;

public class LoadMap : MonoBehaviour
{
    public Tilemap tilemap;
    public Tile[] tiles;
    public string mapJsonPath;

    void Start()
    {
        string jsonText = File.ReadAllText(mapJsonPath);
        TiledMapData mapData = JsonUtility.FromJson<TiledMapData>(jsonText);

        for (int y = 0; y < mapData.height; y++)
        {
            for (int x = 0; x < mapData.width; x++)
            {
                int index = x + y * mapData.width;
                int tileId = mapData.layers[0].data[index] - 1;
                tilemap.SetTile(new Vector3Int(x, y, 0), tiles[tileId]);
            }
        }
    }
}

[System.Serializable]
public class TiledMapData
{
    public int height;
    public int width;
    public TiledMapLayer[] layers;
}

[System.Serializable]
public class TiledMapLayer
{
    public int[] data;
}

map.json

{ "compressionlevel":-1,
 "height":200,
 "infinite":false,
 "layers":[
        {
         "data":[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, ....],
         "height":200,
         "id":1,
         "name":"Tile Layer 1",
         "offsetx":2140,
         "offsety":1336,
         "opacity":1,
         "type":"tilelayer",
         "visible":true,
         "width":200,
         "x":0,
         "y":0
        }],
 "nextlayerid":2,
 "nextobjectid":1,
 "orientation":"staggered",
 "renderorder":"right-down",
 "staggeraxis":"y",
 "staggerindex":"odd",
 "tiledversion":"1.10.1",
 "tileheight":128,
 "tilesets":[
        {
         "firstgid":1,
         "source":"test_tile.tsx"
        }],
 "tilewidth":256,
 "type":"map",
 "version":"1.10",
 "width":200
}

I would like to know how I can modify this code to correctly load the isometric (staggered) map data so that it appears as an overall rectangular shape. Any suggestions or insights into the modifications needed would be greatly appreciated. Thank you!

This is the output from the code

What I am trying to achieve