Nach Bildauflösung in der Galerie sortieren

8

Ich habe diese Galerie vor einer Weile gemacht: Ссылка

Mach dir keine Sorgen, es wird nichts hochladen.

Ich habe gemacht, dass Sie nach Dateigröße sortieren können, aber ich möchte nach Bildauflösung sortieren. Das Problem ist, dass nicht alle Bilder auf die Seite geladen sind, so dass ich nicht weiß, wie groß sie sind.

Die Galerie selbst ist ziemlich einfach, sie fragt nach einem Verzeichnis und es werden dann alle Bilder und Videos in diesem Verzeichnis angezeigt.

Es funktioniert nur in Chrome, klicken Sie einfach auf ganz oben. Die Anzahl vor dem Durchsuchen ist, wie viele Bilder angezeigt oder geladen werden sollen, wenn Sie das Verzeichnis auswählen.

Ich bin mir nicht sicher, wie ich dieses Problem angehen soll ...

Eine Sache, die ich im Sinn hatte, war etwa so:

%Vor%

Das Problem dabei ist, dass es jedes geladene Bild lädt und es würde die Festplatte und den Browser stark belasten, wenn Sie viele Bilder haben, sagen wir 20k Bilder, die Sie laden wollen.

>

Also ja .... irgendwelche Vorschläge wären großartig.

Ich werde den Code hier nicht posten, weil es zu viel ist, bitte sieh dir die Geige an.

    
Chris 01.03.2017, 19:59
quelle

5 Antworten

4

Theoretisch wäre es möglich, ein wenig die Verarbeitung des Browsers zu verbessern, indem diese Werte aus arrayBuffer-Repräsentationen der hochgeladenen Dateien extrahiert werden.

Die meisten Bildformate haben lesbare Metadaten, die die Abmessungen des Mediums enthalten, so dass wir darauf zugreifen können, ohne dass der Browser die Daten des Bildes tatsächlich analysieren und berechnen muss (Dekomprimieren, Dekodieren usw.).

Hier ist ein wirklich grober Proof of Concept, mit ExifReader lib , dass ich nicht zu viel getestet habe , für JPEG-Bilder.

%Vor% %Vor% %Vor%
    
Kaiido 07.03.2017, 13:45
quelle
0

Sie können die Bildgröße verwenden, nachdem Sie nach Ihrer Anforderung sortieren

das ist mein Beispiel: wie man die Bildgröße vor dem Laden Ссылка

bekommt

und

Hier ist die aktualisierte Geige Ссылка , in dieser Geige füge ich meinen Code und die Bildgröße der Konsole hinzu,

ich finde nur, wie man die Bildgröße vor dem Laden erhält.

%Vor%     
user7348450 04.03.2017 07:16
quelle
0

Sie sollten Bilder in Stapeln verarbeiten, sagen wir 20 gleichzeitig.

Beim Laden des Bildes speichern Sie Name und Auflösung für jedes der Bilder in einem Array und zerstören dann die Bilder, um Speicherplatz freizugeben

Wenn Sie die 20 onload oder onerror erhalten, verarbeiten Sie den nächsten Stapel.

Wenn alles erledigt ist, sortieren Sie das Array und zeigen die Bilder an.

Wenn es Hunderte oder Tausende von ihnen gibt, müssen Sie die Galerie paginieren

Es sollte einfach sein, da Sie das Array bereits mit allen Bildnamen und Auflösungen zur Hand haben.

setze einfach einige Variablen zum Starten von offset und page size und slice () das Array, um die benötigte Teilmenge zu erhalten (die "aktuelle Seite")

    
Tudor Ilisoi 07.03.2017 06:51
quelle
0
  

Die Galerie selbst ist ziemlich einfach, sie fragt nach einem Verzeichnis und es   zeigt dann alle Bilder und Videos in diesem Verzeichnis an.

Hier ist eine einfache Lösung, wie man die Größe aller Bilder auf der Webseite bekommt, also wenn man so etwas wie eine einfache Fotogalerie hat, was Bilder aus dem Ordner bekommt und man keine Liste dieser Bilder hat, ist dies die einfachste Lösung, wie man Größe davon bekommt, und dann können Sie verarbeiten, wie Sie wollen.

%Vor% %Vor%
    
Samuel Tulach 07.03.2017 12:44
quelle
0

Könnte so etwas helfen?

%Vor%

oder mit node.js:

%Vor%     
Fred Randall 08.03.2017 00:01
quelle

Tags und Links