nicht angemeldet
Der Martin
Matthias Apsel
dedlfix
JürgenB
Tabellenkalk
Der Martin
Der Martin
Der Martin
TS
TS
TS
Matthias Apsel
TS
Tabellenkalk
Gunnar Bittersmann
Servus und einen schönen Sonntag Morgen,
möchte meine Bilder von gestern online stellen, dazu habe ich folgendes kleines Script geschrieben, das ich im Netz Stückchenweiße gefunden habe
$bv = "bilder";
$vb = "vorschaubilder";
$verzeichnis = opendir($bv);
$bilder = array();
while (($datei = readdir($verzeichnis)) !== false) {
if (preg_match("/\.JPE?G$/", $datei)) {
$bilder[] = $datei;
}
}
closedir($verzeichnis);
foreach ($bilder as $bild) {
$b = imagecreatefromjpeg("$bv/$bild");
$orginalbreite = imagesx($b);
$orginalhoehe = imagesx($b);
$neuebreite = 230;
$neuehoehe = floor($orginalhoehe * ($neuebreite / $orginalbreite));
$neuesbild = imagecreatetruecolor($neuebreite, $neuehoehe);
imagecopyresampled($neuesbild, $b, 0,0,0,0, $neuebreite, $neuehoehe, $orginalbreite, $orginalhoehe);
echo "Thumbnail erzeugt für $bild";
imagejpeg($neuesbild, "$vb/$bild");
imagedestroy($neuesbild);
}
Nachdem ich das Script durchgelaufen ist, erhalte ich die Ausgabe, die ich im Script oben definiert habe. Nun rufe ich meine eigentliche Seite auf um die Bilder ausgeben zu lassen, die sich ab sofort im Order Vorschaubilder befinden
$bv = "bilder";
$verzeichnis = opendir($bv);
$bilder = array();
while(($datei = readdir($verzeichnis)) !== false) {
if (preg_match("/\.JPE?G$/", $datei)) {
$bilder[] = $datei;
}
}
closedir($verzeichnis);
foreach($bilder as $bild) {
echo "<a href='bilder/$bild'><img src='vorschaubilder/$bild' alt='' /></a>\n";
}
Werden auch angezeigt (siehe Bild unten) ABER jetzt kommt mein eigentliches Problem, warum habe ich a) unten ein schwarzen Hintergrund (versaut alles) und b) warum werden aus Hochkant Bilder, Quer Bilder (siehe Bilder 1 und 4).
Könnt ihr vielleicht den Fehler erkennen?
Moin,
ABER jetzt kommt mein eigentliches Problem, warum habe ich a) unten ein schwarzen Hintergrund (versaut alles) und b) warum werden aus Hochkant Bilder, Quer Bilder (siehe Bilder 1 und 4).
Könnt ihr vielleicht den Fehler erkennen?
woher der schwarze Balken kommt, ist aus deinem PHP-Code nicht nachvollziehbar; das sieht für mich korrekt und schlüssig aus.
Das Hoch/Querformat-Problem wird wohl an deiner Kamera bzw. an deiner Art zu fotografieren liegen. Immerhin drehst du ja die Kamera für Hochformat-Bilder um 90°, und genau diese Drehung müsstest du bei der Weiterverarbeitung wieder rückgängig machen. Wenn du Glück hast, ist die Bildorientierung in den EXIF-Daten vermerkt. Das tun aber nicht alle Kameras.
Wie du die mit PHP auslesen kannst, weiß ich aber auch nicht auf Anhieb. Ich weiß, dass es geht, habe das aber noch nie gemacht.
So long,
Martin
Servus und einen schönen Sonntag Morgen,
woher der schwarze Balken kommt, ist aus deinem PHP-Code nicht nachvollziehbar; das sieht für mich korrekt und schlüssig aus.
hab mir die Bilder im Ordner Vorschaubilder angesehen und in diesen ist der schwarze Rand bereits vorhanden, muss also am ersten Code liegen, den ich gepostet habe, denn mehr steht in der Datei nicht drin.
Das Hoch/Querformat-Problem wird wohl an deiner Kamera bzw. an deiner Art zu fotografieren liegen. Immerhin drehst du ja die Kamera für Hochformat-Bilder um 90°, und genau diese Drehung müsstest du bei der Weiterverarbeitung wieder rückgängig machen. Wenn du Glück hast, ist die Bildorientierung in den EXIF-Daten vermerkt.
Schade, das heißt ich muss also meine Bilder alle mit einem Grafikprogramm bearbeiten, sind knapp 500 Stück. Ärgerlich, aber da muss ich nun durch, hätte nie gedacht dass PHP auf so etwas achtet.
Hallo Jessica,
Das Hoch/Querformat-Problem wird wohl an deiner Kamera bzw. an deiner Art zu fotografieren liegen. Immerhin drehst du ja die Kamera für Hochformat-Bilder um 90°, und genau diese Drehung müsstest du bei der Weiterverarbeitung wieder rückgängig machen. Wenn du Glück hast, ist die Bildorientierung in den EXIF-Daten vermerkt.
Schade, das heißt ich muss also meine Bilder alle mit einem Grafikprogramm bearbeiten, sind knapp 500 Stück. Ärgerlich, aber da muss ich nun durch, hätte nie gedacht dass PHP auf so etwas achtet.
Du kannst ja mal mit exif-read-data auf deine Bilder schauen.
Bis demnächst
Matthias
Hallo Matthias,
Du kannst ja mal mit exif-read-data auf deine Bilder schauen.
habe ich bereits, da bekomme ich sehr sehr sehr viele Einträge
FILE.FileName: DSC0344.JPG
FILE.FileDateTime: 1436653860
FILE.FileSize: 4201373
FILE.FileType: 2
FILE.MimeType: image/jpeg
FILE.SectionsFound: ANY_TAG, IFD0, THUMBNAIL, EXIF, GPS, INTEROP
COMPUTED.html: width="4608" height="3072"
COMPUTED.Height: 3072
COMPUTED.Width: 4608
COMPUTED.IsColor: 1
COMPUTED.ByteOrderMotorola: 1
COMPUTED.ApertureFNumber: f/5.3
COMPUTED.UserComment:
COMPUTED.UserCommentEncoding: ASCII
COMPUTED.Thumbnail.FileType: 2
COMPUTED.Thumbnail.MimeType: image/jpeg
IFD0.Make: NIKON CORPORATION
IFD0.Model: NIKON D3100
IFD0.Orientation: 8
IFD0.XResolution: 300/1
IFD0.YResolution: 300/1
IFD0.ResolutionUnit: 2
IFD0.Software: Ver.1.01
IFD0.DateTime: 2015:07:10 14:17:51
IFD0.WhitePoint: Array
IFD0.PrimaryChromaticities: Array
IFD0.YCbCrCoefficients: Array
IFD0.YCbCrPositioning: 2
IFD0.Exif_IFD_Pointer: 352
IFD0.GPS_IFD_Pointer: 37184
THUMBNAIL.Compression: 6
THUMBNAIL.XResolution: 300/1
THUMBNAIL.YResolution: 300/1
THUMBNAIL.ResolutionUnit: 2
THUMBNAIL.JPEGInterchangeFormat: 37312
THUMBNAIL.JPEGInterchangeFormatLength: 9156
THUMBNAIL.YCbCrPositioning: 2
EXIF.ExposureTime: 10/1250
EXIF.FNumber: 53/10
EXIF.ExposureProgram: 0
EXIF.ISOSpeedRatings: 400
EXIF.ExifVersion: 0221
EXIF.DateTimeOriginal: 2015:07:10 14:17:51
EXIF.DateTimeDigitized: 2015:07:10 14:17:51
EXIF.ComponentsConfiguration:
EXIF.CompressedBitsPerPixel: 2/1
EXIF.ExposureBiasValue: 0/6
EXIF.MaxApertureValue: 48/10
EXIF.MeteringMode: 5
EXIF.LightSource: 0
EXIF.Flash: 16
EXIF.UserComment: ASCII
EXIF.SubSecTime: 90
EXIF.SubSecTimeOriginal: 90
EXIF.SubSecTimeDigitized: 90
EXIF.FlashPixVersion: 0100
EXIF.ColorSpace: 65535
EXIF.ExifImageWidth: 4608
EXIF.ExifImageLength: 3072
EXIF.InteroperabilityOffset: 37154
EXIF.SensingMethod: 2
EXIF.FileSource:
EXIF.SceneType:
EXIF.CFAPattern:
EXIF.CustomRendered: 0
EXIF.ExposureMode: 0
EXIF.WhiteBalance: 0
EXIF.DigitalZoomRatio: 1/1
EXIF.FocalLengthIn35mmFilm: 69
EXIF.SceneCaptureType: 0
EXIF.GainControl: 1
EXIF.Contrast: 0
EXIF.Saturation: 0
EXIF.Sharpness: 0
EXIF.SubjectDistanceRange: 0
EXIF.UndefinedTag:0xA500: 22/10
GPS.GPSVersion:
INTEROP.InterOperabilityIndex: R03
INTEROP.InterOperabilityVersion: 0100
Hallo Jessica,
Orientation ist das, was du suchst. http://stackoverflow.com/questions/7489742/php-read-exif-data-and-adjust-orientation
Bis demnächst
Matthias
Hallo Matthias,
Orientation ist das, was du suchst. http://stackoverflow.com/questions/7489742/php-read-exif-data-and-adjust-orientation
danke für den Link, ich bin aber ehrlich, das bekomme ich niemals hin. Meine PHP-Kenntnisse sind gleich 0. Wie im ersten Posting geschrieben habe ich mir das kleine Script im Netz zusammen gesucht.
Hallo Jessica,
1, 3, 6 und 8 sind die möglichen Werte. http://www.impulseadventure.com/photo/exif-orientation.html
Bis demnächst
Matthias
Hallo Matthias,
1, 3, 6 und 8 sind die möglichen Werte. http://www.impulseadventure.com/photo/exif-orientation.html
mein Versuch
$bv = "bilder";
$vb = "vorschaubilder";
$verzeichnis = opendir($bv);
$bilder = array();
while (($datei = readdir($verzeichnis)) !== false) {
if (preg_match("/\.JPE?G$/", $datei)) {
$bilder[] = $datei;
}
}
closedir($verzeichnis);
foreach ($bilder as $bild) {
$image = imagecreatefromjpeg("$bv/$bild");
$exif = exif_read_data($bild);
if(!empty($exif['Orientation'])) {
switch($exif['Orientation']) {
case 8:
$image = imagerotate($image,90,0);
break;
case 3:
$image = imagerotate($image,180,0);
break;
case 6:
$image = imagerotate($image,-90,0);
break;
}
}
// scale image
$ratio = imagesx($image)/imagesy($image); // width/height
if($ratio > 1) {
$width = 230;
$height = round(230/$ratio);
} else {
$width = round(130*$ratio);
$height = 130;
}
$scaled = imagecreatetruecolor($width, $height);
imagecopyresampled($scaled, $image, 0, 0, 0, 0, $width, $height, imagesx($image), imagesy($image));
imagejpeg($scaled, "$vb/$bild");
}
leider ohne Erfolg, es wird noch immer jedes Bild Quer gelegt. Siehst du / Ihr vielleicht den Fehler in meinem Code?
Hallo,
$image = imagecreatefromjpeg("$bv/$bild");
$exif = exif_read_data($bild);
leider ohne Erfolg, es wird noch immer jedes Bild Quer gelegt. Siehst du / Ihr vielleicht den Fehler in meinem Code?
Exif wird nicht fündig: kein bild -> kein exif. Versuchs im entsprechenden Verzeichnis.
Gruß
Kalk
Hallo Kalk,
Exif wird nicht fündig: kein bild -> kein exif. Versuchs im entsprechenden Verzeichnis.
ich hasse solche Flüchtigkeitsfehler :/
$image = imagecreatefromjpeg("$bv/$bild");
$exif = exif_read_data("$bv/$bild");
Hallo,
Du kannst ja mal mit exif-read-data auf deine Bilder schauen.
THUMBNAIL.Compression: 6 THUMBNAIL.XResolution: 300/1 THUMBNAIL.YResolution: 300/1 THUMBNAIL.ResolutionUnit: 2 THUMBNAIL.JPEGInterchangeFormat: 37312 THUMBNAIL.JPEGInterchangeFormatLength: 9156 THUMBNAIL.YCbCrPositioning: 2
Hier ist ja im Prinzip schon ein Vorschaubild vorhanden. Da müsste man doch auch drankommen!?
Gruß
Kalk
Hallo,
THUMBNAIL.Compression: 6 THUMBNAIL.XResolution: 300/1 THUMBNAIL.YResolution: 300/1 THUMBNAIL.ResolutionUnit: 2 THUMBNAIL.JPEGInterchangeFormat: 37312 THUMBNAIL.JPEGInterchangeFormatLength: 9156 THUMBNAIL.YCbCrPositioning: 2Hier ist ja im Prinzip schon ein Vorschaubild vorhanden. Da müsste man doch auch drankommen!?
ich wüsste nicht wie. Wenn ich die Bilder auf meinen Rechner ziehe sind keine Vorschaubilder vorhanden. Ich gehe mal stark davon aus, es sind die Bilder die ich im Display angezeigt bekomme.
Tach!
Das Hoch/Querformat-Problem wird wohl an deiner Kamera bzw. an deiner Art zu fotografieren liegen. Immerhin drehst du ja die Kamera für Hochformat-Bilder um 90°, und genau diese Drehung müsstest du bei der Weiterverarbeitung wieder rückgängig machen. Wenn du Glück hast, ist die Bildorientierung in den EXIF-Daten vermerkt.
Schade, das heißt ich muss also meine Bilder alle mit einem Grafikprogramm bearbeiten, sind knapp 500 Stück. Ärgerlich, aber da muss ich nun durch, hätte nie gedacht dass PHP auf so etwas achtet.
PHP achtet da gar nicht drauf. Die Kamera legt augenscheinlich die Bilder immer im selben Format ab und schreibt nur dazu, ob es hoch oder quer sein soll. Einige Grafikprogramme werten diese zusätzliche Information aus und drehen das Bild entsprechend, andere nicht. Wenn man nun das Bild einfach so bearbeitet und diese Information weder berücksichtigt noch sie beim Speichern wieder einfügt, ist das Bild generell "kaputt".
dedlfix.
Hallo Jessica,
IrfanView kann Bilder im Batchmodus umskalieren.
Gruß Jürgen
Hallo,
$orginalbreite = imagesx($b); $orginalhoehe = imagesx($b);
Könnt ihr vielleicht den Fehler erkennen?
Wenn du zweimal denselben Wert nimmst, musst du dich über quadratische, und damit teilweise schwarze, Bilder nicht wundern.
Gruß
Kalk
Hi,
Wenn du zweimal denselben Wert nimmst, musst du dich über quadratische, und damit teilweise schwarze, Bilder nicht wundern.
gratuliere, du warst einen kleinen Moment schneller. ;-)
Ciao,
Martin
Hallo,
gratuliere, du warst einen kleinen Moment schneller. ;-)
puh, war wirklich knapp :-)
Gruß
Kalk
Hallo,
Wenn du zweimal denselben Wert nimmst, musst du dich über quadratische, und damit teilweise schwarze, Bilder nicht wundern.
danke auch dir für den Hinweis, diesen Fehler habe ich verbessert: http://forum.selfhtml.org/self/2015/jul/12/bilder-verkleiner-plus-anzeigen/1645404#m1645404
Hallo nochmal,
nochmal kritisch drübergeschaut, und siehe da ...
ABER jetzt kommt mein eigentliches Problem, warum habe ich a) unten ein schwarzen Hintergrund
Deswegen:
$orginalbreite = imagesx($b); $orginalhoehe = imagesx($b);
Erkennst du den Fehler jetzt auch? :-)
Ciao,
Martin
Hallo nochmal,
Erkennst du den Fehler jetzt auch? :-)
ja :/ Es muss so lauten
$orginalbreite = imagesx($b);
$orginalhoehe = imagesy($b);
Servus,
das verkleinern wie ihr hier sehen könnt
allerdings bin ich mit der Darstellung noch überhaupt nicht zufrieden. Ich weiß auch dass es bei Hoch- Querformat immer wieder zu Problemen kommt, aber habt ihr vielleicht eine cool Idee, wie es etwas schöner aussehen könnte?
Wäre es vielleicht möglich dass alle Bilder im Querformat erst gelistet werden, anschließend dann die Bilder im Hochformat? Kann PHP dieses von sich aus sortieren, ohne dass ich jetzt jedes Bild umbenennen muss?
Eine weitere Idee wäre, (die würde mir auch am besten gefallen) es sind immer 3 große Bilder nebeneinander. Wenn dazwischen kleine (Hochformat) auftauchen, fass immer 2 zusammen und setzte dieses an diese Stelle wo eigentlich ein großes sein müsste.
Hier ein Bild, wie ich es meine
Ist dieses allein mit CSS möglich oder ist es schwer, dazu mein PHP Code anzupassen?
$bv = "bilder";
$verzeichnis = opendir($bv);
$bilder = array();
while(($datei = readdir($verzeichnis)) !== false) {
if (preg_match("/\.JPE?G$/", $datei)) {
$bilder[] = $datei;
}
}
closedir($verzeichnis);
foreach($bilder as $bild) {
echo "<a href='bilder/$bild'><img src='vorschaubilder/$bild' alt='' /></a>\n";
}
Mahlzeit,
allerdings bin ich mit der Darstellung noch überhaupt nicht zufrieden.
mich wundert vor allem, dass die Bilder so stark in der Größe differieren, obwohl du doch beim Skalieren im Script $neuebreite hart auf 230 setzt. Somit müssten sie eigentlich alle gleich breit werden, aber abhängig von der Orientierung eben verschieden hoch.
Ich weiß auch dass es bei Hoch- Querformat immer wieder zu Problemen kommt, aber habt ihr vielleicht eine cool Idee, wie es etwas schöner aussehen könnte?
Ja. Ich würde beim Skalieren nicht die Breite, sondern die Höhe auf einen festen Wert setzen und die Breite entsprechend nachziehen. Dann sind die Vorschaubilder alle gleich hoch und bilden schon mal eine homogene Zeile.
Wäre es vielleicht möglich dass alle Bilder im Querformat erst gelistet werden, anschließend dann die Bilder im Hochformat?
Klar, möglich ist das. ;-)
Es wäre aber relativ aufwendig, denn du müsstest das Array mit den Bildern nach dem Skalieren noch umsortieren. Würde ich aber gar nicht machen, weil sich oft aus anderen Kriterien eine bestimmte gewünschte Reihenfolge ergibt (Chronologie, Beliebtheit, Anzahl der Downloads).
Eine weitere Idee wäre, (die würde mir auch am besten gefallen) es sind immer 3 große Bilder nebeneinander. Wenn dazwischen kleine (Hochformat) auftauchen, fass immer 2 zusammen und setzte dieses an diese Stelle wo eigentlich ein großes sein müsste.
Auch das wäre IMO relativ komplziert, und sieht auch nur dann wirklich gut aus, wenn zwei Bilder im Hochformat ungefähr die Breite eines Bildes im Querformat haben.
Und noch was: Die Schleife am Anfang deines Scripts, mit der du die Bilder im Verzeichnis aufsammelst, ist meiner Ansicht nach viel zu umständlich. Anstatt mit opendir() und readdir() zu hantieren, würde ich einfach glob() verwenden. So liefert dir beispielsweise
$bilder = glob("$verzeichnis/*.{jpg,jpeg,JPG,JPEG}", GLOB_BRACE);
genau das Array mit den Bild-Dateinamen, das du aufwendig mit einer while-Schleife erzeugst. Abgesehen davon findet deine Schleife auch nur Dateinamen mit Extension in Großbuchstaben - Dateien, bei denen die Extension klein geschrieben ist, wie das üblich ist, werden nicht gefunden.
So long,
Martin
Hallo,
Eine weitere Idee wäre, (die würde mir auch am besten gefallen) es sind immer 3 große Bilder nebeneinander. Wenn dazwischen kleine (Hochformat) auftauchen, fass immer 2 zusammen und setzte dieses an diese Stelle wo eigentlich ein großes sein müsste.
Auch das wäre IMO relativ komplziert, und sieht auch nur dann wirklich gut aus, wenn zwei Bilder im Hochformat ungefähr die Breite eines Bildes im Querformat haben.
das kann ich ja beim hochladen festlegen, also gehen wir mal davon aus, dass zwei hochkann Bilder immer eine Breite von einem Querformat Bild hat. Wie müsste ich dann vorgehen? Benötige ich dazu PHP oder kann ich dieses allein mit CSS regeln?
Mein Problem ist einfach, ich möchte etwas vernünftiges haben, wenn ich alles durcheinander ist, dann denken die User die sich die Bilder ansehen, ach du scheiße, wenn die schon die Bilder so präsentiert, wie wird dieses dann erst bei einem Shooting?.
Vielleicht kannst du mir ja ein Tipp und oder Beispiel geben, wie ich dieses umsetzten kann.
Hallo und guten Morgen,
Eine weitere Idee wäre, (die würde mir auch am besten gefallen) es sind immer 3 große Bilder nebeneinander. Wenn dazwischen kleine (Hochformat) auftauchen, fass immer 2 zusammen und setzte dieses an diese Stelle wo eigentlich ein großes sein müsste.
Auch das wäre IMO relativ komplziert, und sieht auch nur dann wirklich gut aus, wenn zwei Bilder im Hochformat ungefähr die Breite eines Bildes im Querformat haben.
das kann ich ja beim hochladen festlegen, also gehen wir mal davon aus, dass zwei hochkann Bilder immer eine Breite von einem Querformat Bild hat. Wie müsste ich dann vorgehen? Benötige ich dazu PHP oder kann ich dieses allein mit CSS regeln?
Ich wüsste jetzt nicht, wie man mit CSS ein Bild drehen könnte. Und genau das scheint ja notwendig zu sein.
Ob aber die Gleichmacherei (militärische Ausrichtung) deine Galiere nicht nachher langweilig erscheinen lässt, das sollte man noch gesondert betrachten. Vielleicht lässt Du einfach etwas Platz zwischen den Objekten, auf dem sich Auge ausruhen kann und zwängst nicht alle Bilder in gleiche "Kisten".
Grüße
TS
Hallo,
Ich wüsste jetzt nicht, wie man mit CSS ein Bild drehen könnte. Und genau das scheint ja notwendig zu sein.
mit CSS muss ich ja nichts mehr drehen, die Bilder sind ja mittlerweile im richtigen Format im Ordner Vorschaubilder. Jetzt geht es um die Anordnung.
Ob aber die Gleichmacherei (militärische Ausrichtung) deine Galiere nicht nachher langweilig erscheinen lässt, das sollte man noch gesondert betrachten. Vielleicht lässt Du einfach etwas Platz zwischen den Objekten, auf dem sich Auge ausruhen kann und zwängst nicht alle Bilder in gleiche "Kisten".
Über das Design möchte ich hier nicht diskutieren, denn diese Diskussion nimmt kein Ende. Jeder hat eine andere Meinung.
Meine Webseite, Flyer und Visitenkarten haben ein bestehendes Design und das darf und möchte ich nicht über den Haufen werfen, es heißt ja immer ein Design und ein Logo zu ändern verbirgt sehr große Gefahren.
Hallo und guten Morgen,
Ich wüsste jetzt nicht, wie man mit CSS ein Bild drehen könnte. Und genau das scheint ja notwendig zu sein.
Scheint ja doch 'was zu gehen:
http://www.css-lernen.net/css-drehen-rotate-transformieren.php
Muss ich gleich mal ausprobieren :-)
Grüße
TS
Hallo,
(guten Morgen um 15:33 Uhr ist schon etwas hart :D)
Scheint ja doch 'was zu gehen:
http://www.css-lernen.net/css-drehen-rotate-transformieren.php
Muss ich gleich mal ausprobieren :-)
wie schon geschrieben es kommt mir NICHT auf das Drehen der Bilder an, das habe ich ja schon gelöst, es kommt mir darauf an, wie ich die Bilder sortieren kann um eine spezielle Anordnung zu bekommen :)
Hallo und schönen Regennachmittag,
(warten auf den Regenbogen)
(guten Morgen um 15:33 Uhr ist schon etwas hart :D)
Oh, entschuldige bitte. Hier machen alle Anderen immer alles richtig und ich suche immer die Fettnäppchen.
Scheint ja doch 'was zu gehen:
http://www.css-lernen.net/css-drehen-rotate-transformieren.php
Muss ich gleich mal ausprobieren :-)wie schon geschrieben es kommt mir NICHT auf das Drehen der Bilder an, das habe ich ja schon gelöst, es kommt mir darauf an, wie ich die Bilder sortieren kann um eine spezielle Anordnung zu bekommen :)
Das habe ich jezt eigentlich auch nicht mehr für Dich geschrieben, sondern nur zur Ergänzung des Threads. Ich hoffe, dass Du das dulden kannst.
Ich rate jetzt mal: Sortierung am Client ginge sicherlich mit einem Preload der Bilder und Javacript.
Aber warum das nicht schon am Server machen, wenn es dort schon geht?
Grüße
TS
Hallo,
Das habe ich jezt eigentlich auch nicht mehr für Dich geschrieben, sondern nur zur Ergänzung des Threads. Ich hoffe, dass Du das dulden kannst.
mir ist das egal was du hier schreibst :) Ich wollte es nur nochmals sagen nicht dass du dir irgendwelche Gedanken machst, wie ich mein erstes Problem anderes lösen hätte können. Man muss sich ja nicht mehr Arbeit machen, als man eh schon hat.
Ich rate jetzt mal: Sortierung am Client ginge sicherlich mit einem Preload der Bilder und Javacript. Aber warum das nicht schon am Server machen, wenn es dort schon geht?
Das ist ja aktuell noch meine Frage / Problem wie bekomme ich das hin. Hier habe ich mein Problem etwas genauer beschrieben: http://forum.selfhtml.org/self/2015/jul/12/bilder-verkleiner-plus-anzeigen/1645422#m1645422
Und hier noch die passende Grafik dazu: http://forum.selfhtml.org/self/2015/jul/12/bilder-verkleiner-plus-anzeigen/1645417#m1645417 auf das letzte Bild achten.
Hallo,
mit etwas CSS habe ich es fast hinbekommen
img {
border: 2px solid #000;
background-color: #fff;
padding: 0px;
height: 160px;
min-width: 116px;
margin-bottom: 1em;
margin-right: 3px;
}
jetzt bleibt noch die Frage, wie kann ich erreichen, dass ich mit PHP Bilder sortiert bekomme, denn in der dritten Reihe hätte noch ein hochkannt Bild platz. Ich weiß nicht, warm hier ein Platz leer bleibt, der Zeile 2 wird auch alles ausgefüllt
$bv = "bilder";
$verzeichnis = opendir($bv);
$bilder = array();
while(($datei = readdir($verzeichnis)) !== false) {
if (preg_match("/\.JPE?G$/", $datei)) {
$bilder[] = $datei;
}
}
closedir($verzeichnis);
foreach($bilder as $bild) {
echo "<a href='bilder/$bild' class='fancybox-button' rel='fancybox-button'><img src='vorschaubilder/$bild' alt='Vorschaubild' /></a>\n";
}
Hallo Jessica,
Ich weiß nicht, warm hier ein Platz leer bleibt, der Zeile 2 wird auch alles ausgefüllt
Weil das erste Bild in Reihe 4 im Querformat ist und dieses nicht mehr in die Zeile 3 passt.
Bis demnächst
Matthias
Hallo Matthias,
Weil das erste Bild in Reihe 4 im Querformat ist und dieses nicht mehr in die Zeile 3 passt.
PHP muss ich aber auch anstellen, warum kann er nicht einfach ein Bild nehmen das da noch rein passt? Besteht irgendwie die Möglichkeit zu zählen?
Folgende Optionen gibt es:
Es muss ja irgendwie möglich sein, oder? Ich dachte immer mit PHP und CSS kann man so viel machen. Scheinbar aber nicht mal die einfachsten Sachen :/
Edit: Warum steht in den Felder immer schon etwas drin.
Total unübersichtlich. Außerdem kann man einen Namen nicht überschreiben ich muss jedes mal die Seite neu laden und schnell etwas eintragen.
Hallo Svenja,
Warum steht in den Felder immer schon etwas drin.
Total unübersichtlich. Außerdem kann man einen Namen nicht überschreiben ich muss jedes mal die Seite neu laden und schnell etwas eintragen.
Siehe forum.selfhtml.org/meta/2015/jun/14/2-bitten/ ff.
Die beiden unteren Felder zeigen lediglich den Inhalt des placeholder-Attributs.
Bis demnächst
Matthias
Hallo und guten Nachmittag,
(hier herrscht Dschungelklima)
mit etwas CSS habe ich es fast hinbekommen
img { border: 2px solid #000; background-color: #fff; padding: 0px; height: 160px; min-width: 116px; margin-bottom: 1em; margin-right: 3px; }jetzt bleibt noch die Frage, wie kann ich erreichen, dass ich mit PHP Bilder sortiert bekomme, denn in der dritten Reihe hätte noch ein hochkannt Bild platz. Ich weiß nicht, warm hier ein Platz leer bleibt, der Zeile 2 wird auch alles ausgefüllt
$bv = "bilder"; $verzeichnis = opendir($bv); $bilder = array(); while(($datei = readdir($verzeichnis)) !== false) { if (preg_match("/\.JPE?G$/", $datei)) { $bilder[] = $datei; } } closedir($verzeichnis); foreach($bilder as $bild) { echo "<a href='bilder/$bild' class='fancybox-button' rel='fancybox-button'><img src='vorschaubilder/$bild' alt='Vorschaubild' /></a>\n"; }
Nur als Beisiel:
Kennst Du auch schon die PHP-Funktionen glob() (als Alternative für readdir() ) und getimagesize()?
Wenn deine Bildergalerie nun keine Semantische Ordnung einhalten muss, sondern die Bilder nur nach Größe aufgereiht werden sollen, also dass die Zeilen immer voll werden, dann kannst Du sie doch vorher "sortieren" und für die Ausgabe wieder mischen. Ich habe das nun so verstanden, dass Du das auch willst?
Nun gilt es, einen Algoritmus zu finden, der so viele der bereitstehenden Bilder berücksichtigt und immer volle Zeilen ausgibt. Du musst also vorher zählen wieviele hoch- und wieviele quwerformatige Bilder vorhanden sind. Der Rest ist Mathematik.
Da kannst Du dann auch Muster bauen, wie beim Mauern :-)
Grüße
TS
Hallo und guten Nachmittag,
Kennst Du auch schon die PHP-Funktionen glob() (als Alternative für readdir() ) und getimagesize()?
das hat mir Der Martin heute Nachmittag bereits gesagt, hab damit auch schon bisschen rumgespielt
$verzeichnis_vorschau = "bilder";
$bilder = glob("$verzeichnis/*.{jpg,jpeg,JPG,JPEG}", GLOB_BRACE);
foreach($bilder as $bild) {
echo "<a href='$bild' class='fancybox-button' rel='fancybox-button'><img src='vorschaubilder/$bild' alt='Vorschaubild' /></a>\n";
}
leider ohne großen Erfolg, ich sehe zwar alle Bilder, aber meine kleine Vorschaubilder liegen ja in einem anderen Ordner und er gibt mir ständig einen falschen Pfad an, also habe ich es erstmal wieder gelassen.
Wenn deine Bildergalerie nun keine Semantische Ordnung einhalten muss, sondern die Bilder nur nach Größe aufgereiht werden sollen, also dass die Zeilen immer voll werden, dann kannst Du sie doch vorher "sortieren" und für die Ausgabe wieder mischen. Ich habe das nun so verstanden, dass Du das auch willst?
- Hole Dir alle Bilder z.B. mit glob() in ein Array (A).
- gehe das Array Element für Element durch, kontrolliere mit getimagesize() nochmal, ob das Element ein Bild ist, stelle das Format fest,
- sortiere die hochformatigen in Array (B)
- sortiere die querformatigen in Array (C)
- erzeuge für die Ausgabe in einer Schleife mehrfach das Array (D), in dem immer die Zeile gefüllt ist. Die beiden Quell-Arrays (B) und (C) werden dabei immer um das jeweils entnommene Bild verkürzt.
Hört sich sehr gut an, aber wie heute Nachmittag mehrfach erwähnt kenne ich mich mit PHP 0 aus, alle was ich bis jetzt erreicht habe, habe ich mir aus dem Netz irgendwoher gezogen und getestet ob es funktioniert.
Hallo und guten Nachmittag,
- Hole Dir alle Bilder z.B. mit glob() in ein Array (A).
hab ich hier denn nicht schon ein Array?
$bilder[] = $datei;
Hallo,
jetzt bleibt noch die Frage, wie kann ich erreichen, dass ich mit PHP Bilder sortiert bekomme,
In einer Flexbox kann man per CSS sortieren. Wie das hier aber angwendet werden muss, da schlafe ich erst noch ein paar mal drüber...
Gruß
Kalk
Mahlzeit,
Ja. Ich würde beim Skalieren nicht die Breite, sondern die Höhe auf einen festen Wert setzen und die Breite entsprechend nachziehen. Dann sind die Vorschaubilder alle gleich hoch und bilden schon mal eine homogene Zeile.
habe ich auch so abgeändert, dass alle Bilder die gleiche Höhe haben
if($ratio > 1) {
$width = 230;
$height = round(230/$ratio);
} else {
$width = round(153*$ratio);
$height = 153;
}
Jetzt bleibt nur noch diese Frage offen: http://forum.selfhtml.org/self/2015/jul/12/bilder-verkleiner-plus-anzeigen/1645422#m1645422
@@Der Martin
Ja. Ich würde beim Skalieren nicht die Breite, sondern die Höhe auf einen festen Wert setzen und die Breite entsprechend nachziehen. Dann sind die Vorschaubilder alle gleich hoch und bilden schon mal eine homogene Zeile.
Oder nicht auf einen festen Wert, sondern alle Bilder derselben Zeile haben dieselbe Höhe und füllen die Zeile in der Breite vollständig aus, d.h je nach den Breiten der Bilder sind deren Höhen von Zeile zu Zeile unterschiedlich.
Dann sind aber die Bilder nicht homogen; Bilder im Querformat sind größer als solche im Hochformat. Für gleichgroße Bilder müsste man die nicht auf gleiche Höhe oder Breite bringen, sondern auf gleiche Fläche. So sieht’s aus.
LLAP 🖖