Ubocznym skutkiem dodania współrzędnych geograficznych do zdjęć za pomocą skryptu gpsPhoto.pl jest plik w formacie KML. Każde zdjęcie w takim pliku jest oznakowane jak na przykładzie:
<Placemark> <name>s300013_08275298.jpg</name> <description><![CDATA[<a href="/home/tomek/Obrazy/s300013_08275298.jpg"> <img src="/home/tomek/Obrazy/s300013_08275298.jpg" width="200" /></a><br> <a href="/home/tomek/Obrazy/s300013_08275298.jpg">full size</a>]]> </description> <Point> <altitudeMode>clampToGround</altitudeMode> <coordinates>16.496808361,53.466461571,122</coordinates> </Point>
Dawno temu zrobiłem skrypt, który podmienia adres w lokalnym systemie plików (taki jak
/home/tomek/Obrazy/s300013_08275298.jpg
) na tenże plik, ale umieszczony
na moim koncie w serwisie flickr.com
:
<Placemark> <name>s300013_08275298.jpg</name> <description><![CDATA[<a href="http://www.flickr.com/tprzechlewski/9615076609/"> <img src="http://static.flickr.com/7411/9615076609_a243eed0f1_m.jpg" width="200" /></a><br> <a href="http://www.flickr.com/tprzechlewski/9615076609/">full size</a>]]> </description> ... itd ...
Taki plik za pomocą kilku klików importowałem do mapy Google (Mapy→Moje Miejsca → utwórz w klasycznej wersji Moich map) i działało -- do zeszłego piątku, kiedy to plik KML z wycieczki do Nadarzyc uparcie nie chciał się poprawnie wyświetlić (#1 -- obcięty ślad w okolicach Nadarzyc).
Konsultując problem via Google dowiedziałem się, że cyt KML upload and rendering has always
been problematic with Maps i że lepiej (jeżeli już) to nie importować KML tylko
wyświetlić go podając URL do
dokumentu KML jako wartość parametru q
.
Przykład:
https://mapy.google.pl/maps?q=http://pinkaccordions.homelinux.org/Geo/kml/20130828__MP.kml
Działa (rys. #2).
Ponieważ serwer pinkaccordions.homelinux.org jest rachityczny pomyślałem, że dobrze by
było plik KML umieścić w jakimś lepszym miejscu, np. na witrynie sites.google.com
.
Jest nawet dedykowany -- i niestary bo z 2010 roku -- dokument w temacie
pn. Using Google Sites to Host Your KML
Niestety
plik KML pobierany z http://sites.google.com/site/
nie wyświetla się poprawnie. Po kliknięciu
w ikonę niektórych zdjęć otwiera się okno ale jest
ono puste (#3) i/lub nie wskazuje na stosowne miejsce na mapie (por. #4). Kombinowałem jak toto poprawić
ale nie doszedłem do żadnych pozytywnych wniosków: połączenie GMaps + KML + sites.google.com nie działa.
PS: przypomniałem sobie, że mój Internet Provider daje w pakiecie konto na serwerze WWW z limitem 200Mb (z którego do tej pory mało korzystałem)... Sprawdziłem -- działa. Będę zatem tam trzymał pliki KML/KMZ (Rys. #5.)
Uwaga: w tym wpisie przykłady ilustrujące działanie Lightboksa NIE DZIAŁAJĄ, bo
na blogu pinkaccordions.homelinux.org
nie ma zainstalowanego Lightboksa.
(Działają tutaj).
Kliknięcie zdjęcia lub obrazu zamieszczonego na blogu powoduje wyświetlenie go w nakładce na stronie. Jest to tzw. widok Lightbox. (cf. Widok Lightbox w Bloggerze):
<div> <span> <a href="https://lh4.googleusercontent.com/-cKBvbosMsII/Ua4zYPs99kI/AAAAAAAAB90/NLTG1cMbI88/epl313_6040342.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="https://lh4.googleusercontent.com/-cKBvbosMsII/Ua4zYPs99kI/AAAAAAAAB90/NLTG1cMbI88/s128/epl313_6040342.jpg" /></a> </span> <span> <a href="http://lh3.ggpht.com/-3POvL9Uv478/UhXICIpp_3I/AAAAAAAAB-w/K1rRrCU2D9c/epl313_6040338.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="http://lh3.ggpht.com/-3POvL9Uv478/UhXICIpp_3I/AAAAAAAAB-w/K1rRrCU2D9c/s128/epl313_6040338.jpg" /></a> </span> <span> <a href="http://lh6.ggpht.com/-nmAnV2_TD8U/UhXIIoYKraI/AAAAAAAAB-4/mWAJWpsOUZU/epl313_6040339.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="http://lh6.ggpht.com/-nmAnV2_TD8U/UhXIIoYKraI/AAAAAAAAB-4/mWAJWpsOUZU/s128/epl313_6040339.jpg" /></a> </span> <span> <a href="http://lh5.ggpht.com/-wO5_E5_jK14/UhXG7Rd-bSI/AAAAAAAAB-c/x76Ee7I9tgU/epl313_6040332.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="http://lh5.ggpht.com/-wO5_E5_jK14/UhXG7Rd-bSI/AAAAAAAAB-c/x76Ee7I9tgU/s128/epl313_6040332.jpg" /></a> </span> </div>
Wynik jest następujący (kliknij w zdjęcie aby przejść do widoku Lightboksa):
W powyższym przykładzie zawartość atrybutów href
i src
jest prawie identyczna, bo różni się wyłącznie
fragmentem s128/
.
Jest to przykład zastosowania sprytnego URLa, który spowoduje automagiczne przeskalowanie
zdjęcia, tak aby dłuższy wymiar miał maksymalnie 128 pikseli. Jeżeli zamiast s128/
wstawimy
s128-c/
albo s128-p/
, to
spowoduje to automagiczne wycięcie kwadratu o wymiarach maksymalnych 128 pikseli (crop).
Przykład:
<div> <span> <a href="http://lh3.ggpht.com/.../epl313_6040338.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="http://lh3.ggpht.com/.../s128-c/epl313_6040338.jpg" /></a> </span> <span> <a href="http://lh3.ggpht.com/.../epl313_6040338.jpg" imageanchor="1" style="margin-bottom: 1em; margin-right: .1em;"><img border="0" src="http://lh3.ggpht.com/.../s128-p/epl313_6040338.jpg" /></a> </span>
Symbolem ...
oznaczono pominiętą część URLa (żeby nie wystawał na margines).
Wynik (kliknięcie w zdjęcie nie powoduje przejścia do widoku Lightboksa):
BTW: Liczba 128 nie jest magiczna, można przeskalować obrazek na inny wymiar.
Jeżeli zdjęcia są różnych wymiarów (portret/pejzaż),
to s128-c/
(albo s128-p/
) jest lepsze niż zwykłe s128
,
bo minaturki są jednakowej wielkości,
tyle że Lightbox takie zdjęcia ignoruje. Czemu -- nie wiem... Nie wiem też jak to zmienić
Jako obejście problemu można przeskalować miniaturkę do jednakowej wysokości. Przykład:
<div> <span> <a href="https://lh4.googleusercontent.com/.../epl313_6040342.jpg" imageanchor="1" style="margin-bottom: 1em;"><img border="0" height='85' src="https://lh4.googleusercontent.com/.../s128/epl313_6040342.jpg" /></a> </span> <span> <a href="http://lh3.ggpht.com/.../epl313_6040338.jpg" imageanchor="1" style="margin-bottom: 1em;"><img border="0" height='85' src="http://lh3.ggpht.com/.../s128/epl313_6040338.jpg" /></a> </span> <span> <a href="http://lh6.ggpht.com/.../epl313_6040339.jpg" imageanchor="1" style="margin-bottom: 1em;"><img border="0" height='85' src="http://lh6.ggpht.com/.../s128/epl313_6040339.jpg" /></a> </span> <span> <a href="http://lh5.ggpht.com/.../epl313_6040332.jpg" imageanchor="1" style="margin-bottom: 1em;"><img border="0" height='85' src="http://lh5.ggpht.com/.../s128/epl313_6040332.jpg" /></a> </span> </div>
Symbolem ...
oznaczono pominiętą część URLa (żeby nie wystawał na margines).
Wynik jest następujący:
Kliknięcie w zdjęcie powoduje przejście do widoku Lightboksa.
Być może za czas jakiś problem zniknie. Wyświetlanie dla tego wpisu 10 zamiast 8 obrazków w widoku Lightboksa będzie tego dowodem:-)