JSFiddle - React, Tailwind, and code Playground

JavaScript

var sdata = {
    "4": {
        "7": ["1", "7", "2", "2"]
    },
    "3": {
        "3": ["2", "8", "1", "1"]
    }
};

(function populate_collisions() {
    gcollision = {
        x: [],
        y: []
    };

    for (var key in sdata) {
        for (var keyTwo in sdata[key]) {
            gcollision.x.push(sdata[key][keyTwo][0]);
            gcollision.x.push(sdata[key][keyTwo][0] + (sdata[key][keyTwo][2] - 1));
            gcollision.y.push(sdata[key][keyTwo][1]);
            gcollision.y.push(sdata[key][keyTwo][1] + (sdata[key][keyTwo][3] - 1));

        }
    }
    console.log(gcollision);
}())