Arrange checkboxes

I need to get the right value of 3 checkboxes. The first checkbox describes if the picture is north. The second describes if the picture is on the side and the third describes if the picture should be selected to send. Example

This code generates the three checkboxes:

for (var i = 0; i < xmlDoc.getElementsByTagName("imgfilename").length; i++) {
      bilderTemp[i] = xmlDoc.getElementsByTagName("imgfilename")[i].childNodes[0].nodeValue;
      $('.login-form').append('<input type="checkbox" name="himmelsrichtung"><input type="checkbox" name="orientation"><input type="checkbox" name="url" value='+bilderTemp[i]+'><img src='+bilderTemp[i]+' width="50%"></br>');
};

To get the ticked checkboxes, I use this code:

var arrayUrl = $("input[name='url']:checked").map(function(){
      return this.value;
}).get()

var arrayHimmelsrichtung = $("input[name='himmelsrichtung']").map(function(){
      if($(this).is(':checked')) {
        return "True";
      } else {
        return "False";
      }
}).get()

var arrayOrientation = $("input[name='orientation']").map(function(){
      if($(this).is(':checked')) {
        return "True";
      } else {
        return "False";
      }
}).get()

And then I push the values to a JavaScript Object like this:

var picture = [];
    $(arrayUrl).each(function(index) {
      picture.push({
        "url": arrayUrl[index],
        "Norden" : arrayHimmelsrichtung[index],
        "Side" : arrayOrientation[index]
      });
});

But the sequence of values in my array is invalid when I e.g. take only the third picture. Example