Veuillez regarder mon:

JSFiddle

J'ai un jeu de données et je veux pousser une nouvelle valeur dans le tableau.

Cette valeur est déterminée par la somme d'une taille cumulée inférieure à windowSize.

Mise à jour: En fin de compte, j'essaie de créer un groupe de compensations. J'ai pensé En calculant le nombre de données [i] .size.updated.width qui iraient dans le window.innerWidth actuel, je peux savoir jusqu'où traduire un élément. Pour ce faire, une fois que tempGroupSize est supérieur à WindowWidth, j'ai besoin de pousser ce décalage vers le data [i] .pageGroup. Et passez ensuite aux données suivantes [i] et répétez le processus.

Cela peut-être plus facile si vous le faites avec lo-dash? (je suis assez novice avec ça)

Les données finales devraient ressembler à:

 var data = [{
    "size": {
        "original": {
            "height": 2857,
            "width": 2000
        },
        "updated": {
            "width": 718.9359467973399,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    //this is value is an example of the windowwidth > 1436 but less than 2154(3 pages)
    "pageGroup": [1436]
},

// cela se répétera pour chaque index car l'ensemble de données a toutes les mêmes tailles .fin de mise à jour

J'itère deux fois la page Ever afin de pouvoir pousser un groupe de cette taille par page data[i].pageGroup.push(tempGroupSize);

Problème: Quand je casse; il semble que les deux boucles s'arrêtent.

Question:

Comment pourrais-je continuer cette boucle jusqu'à ce que for i soit terminé?

Avertissement:

Je dois retourner currentBreakPage pour m'assurer de ne pas parcourir les pages déjà groupées

for (var i = 0; i < data.length; i++) {
    for(var k = currentBreakPage; k < data.length; k++){
        //makes sure it's not the first time through
        if(currentBreakPage === 0){
           // console.log('break is:', 0);
            iterator = data[i].size.updated.width;
            //console.log(iterator);
        } else {
            //console.log('break is else:', currentBreakPage);
            iterator = data[currentBreakPage].size.updated.width
        }
        //iterator must be subtracted because we dont want to count the most current page in the the total window size;
        if(tempGroupSize < (windowWidth -  iterator)){
            tempGroupSize += data[k].size.updated.width;
        } else {
            currentBreakPage = k;
            data[i].pageGroup.push(tempGroupSize);

            break;
        }
    }
    console.log('pageGrooup', currentBreakPage)
}
0
Matthew Harwood 5 nov. 2014 à 09:49

3 réponses

Meilleure réponse

J'ai mis à jour votre violon pour vous donner une idée de ce qui se passe. J'ai corrigé quelques points-virgules manquants et converti le code pour me connecter à un <div> dans la fenêtre du violon. http://jsfiddle.net/5v5abqzq/3/

Il semble que vos mathématiques ne soient tout simplement pas ce que vous attendez. La première boucle passe à la valeur tempGroupSize, mais chaque boucle après cela revient à réinitialiser currentBreakPage à 0.

L'exécution de ce code dans la fenêtre d'extrait SO renvoie toujours un nombre négatif pour windowWidth - iterator, donc le code définira toujours k = currentBreakPage;, ce qui signifie k = 0. Votre boucle for définit toujours var k = currentBreakPage, vous créez donc une boucle sans fin en fonction de la taille de votre fenêtre.

Lorsque je l'ai exécuté en tant que jsfiddle, j'ai obtenu un plus grand nombre, mais currentBreakPage serait alors bloqué à 1 car ce code est toujours évalué à faux: if(tempGroupSize < (windowWidth - iterator)){

Vérifiez votre algorithme et vos calculs, et vérifiez ce que vous essayez de faire.

** EDIT: Voici le nouveau violon. J'ai mis à jour le tempGroupSize = 0;: http://jsfiddle.net/5v5abqzq/6/

var logger = {
    log: function (text){
        var _console = document.getElementById('console');
        _console.innerHTML = _console.innerHTML + '<br />' + text;
    }
};

var windowWidth = window.innerWidth;
var tempGroupSize = 0,
    currentBreakPage = 0,
    iterator = '';
logger.log('win' + windowWidth);
var data = [{
    "size": {
        "original": {
            "height": 2857,
            "width": 100
        },
        "updated": {
            "width": 10,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 200
        },
        "updated": {
            "width": 100,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 2000
        },
        "updated": {
            "width": 100,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 200
        },
        "updated": {
            "width": 100,
            "height": 100,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 100
        },
        "updated": {
            "width": 50,
            "height": 50,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 300
        },
        "updated": {
            "width": 200,
            "height": 200,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 400
        },
        "updated": {
            "width": 100,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}, {
    "size": {
        "original": {
            "height": 2857,
            "width": 500
        },
        "updated": {
            "width": 200,
            "height": 1027,
            "isPortrait": false
        }
    },
    "ratio": 0.7000350017500875,
    "pageGroup": []
}];
logger.log(data.length);

for (var i = 0; i < data.length; i++) {
    for(var k = currentBreakPage; k < data.length; k++){
        
        if(currentBreakPage === 0){
           // console.log('break is:', 0);
            iterator = data[i].size.updated.width;
            logger.log(iterator);
            //console.log(iterator);
        } else {
            //console.log('break is else:', currentBreakPage);
            iterator = data[currentBreakPage].size.updated.width
            logger.log('currentBreakPage: ' + currentBreakPage);
        }
        
        logger.log('tempGroupSize: ' + tempGroupSize + ', (windowWidth - iterator): ' + (windowWidth - iterator) + ', result: ' + (tempGroupSize < (windowWidth -  iterator)) );
        
        if(tempGroupSize < (windowWidth -  iterator)){
            tempGroupSize += data[k].size.updated.width;

            logger.log('setting temp group size to ' + tempGroupSize);         
            
        } else {
            
            currentBreakPage = k;
            logger.log('currentBreakPage: ' + currentBreakPage);
            data[i].pageGroup.push(tempGroupSize);
            tempGroupSize = 0;
            
            break;
        }
    
       
        
    }
    logger.log('pageGroup' + currentBreakPage);
}

    
<div id="console"></div>
0
ps2goat 5 nov. 2014 à 08:14

Remplacez break par k = data.length

Si jamais vous voulez arrêter une boucle, faites simplement sortir votre itérateur des limites pour qu'il ne passe plus par la boucle.

0
aug 5 nov. 2014 à 06:52

Eh bien break quitte simplement la boucle dans laquelle il est présent

for(j=0;j<val1;j++)
{
for(k=0;k<val2;k++)
{
if(condition)
break;
}
//after break you will be here in second loop
}
0
N Kumar 5 nov. 2014 à 07:40