Use a JavaScript FOR in Areas with ImageMapster

Question

I'm using ImageMapster and I want to select specific areas which are defined into an array, something like this:

var Carnet=new Array("6a","7a","8a","7c","8c","9c","23g","23g","14m","15m","16m");
var c = Carnet.length;

$('#central').mapster({
    mapKey: 'asiento',
    fillOpacity: 0,
    fillColor: "000000",
    stroke: true,
    strokeColor: "32CD32",
    strokeOpacity: 0.8,
    strokeWidth: 1,
    singleSelect : false,
    areas:  [
        for(i=0;i<c;i++)
        {
            {
                key: Carnets[i],
                fillOpacity: 0,
                fillColor: "000000",
                stroke: true,
                strokeColor: "00FF00",
                isSelectable:false
            }
    }]
});

but have problems with FOR... how works in that case?

Answer 1

So you want to have the property areas populated by a for loop in an object literal? You can do this quite easily with an immediate invoked function expression (IIFE):

$('#central').mapster({
    mapKey: 'asiento',
    fillOpacity: 0,
    fillColor: "000000",
    stroke: true,
    strokeColor: "32CD32",
    strokeOpacity: 0.8,
    strokeWidth: 1,
    singleSelect : false,
    areas:  (function(Carnets, c){
        var myArray = [];
        for(var i=0;i<c;i++)
        {
            myArray.push({
               key: Carnets[i],
               fillOpacity: 0,
               fillColor: "000000",
               stroke: true,
               strokeColor: "00FF00",
               isSelectable:false
            });
        }
        return myArray;
    })(Carnets, c)
});

Now the array returned by your function will be assigned to the areas property of your object.