I have a problem with inserting data via an array to populate the datamaps map.

My code is this, but it keeps giving me error, they don't like the for loop inside i.bubbles

(function($) {
"use strict"

var i = new Datamap( {
    scope: "world", 
    element: document.getElementById("world-map"), 
    responsive: !0, 
    geographyConfig: {
        popupOnHover: !1, 
        highlightOnHover: !1, 
        borderColor: "transparent", 
        borderWidth: 1, 
        highlightBorderWidth: 3, 
        highlightFillColor: "rgba(0,123,255,0.5)", 
        highlightBorderColor: "transparent", 
        borderWidth: 1
    }, 
    bubblesConfig: {
        popupTemplate: function (e, i) {
            return '<div class="datamap-sales-hover-tooltip">' + i.country + '<span class="ml-2"></span>' + i.sold + "</div>"
        }, 
        borderWidth: 0, 
        highlightBorderWidth: 3, 
        highlightFillColor: "rgba(0,123,255,0.5)", 
        highlightBorderColor: "transparent", 
        fillOpacity: .75
    }, 
    fills: {
        Visited: "#777", 
        neato: "#777", 
        white: "#777", 
        defaultFill: "#EBEFF2"
    }
});

i.bubbles([
    for(x=0; x<(length.array); x++){

        {
            centered: "DEU", fillKey: "white", radius: 5, sold: "75-sdjfbvksfnd", country: "German"
        },

    },
]),
window.addEventListener("resize", function (e) {
    i.resize()
});

})(jQuery);