Google Maps on mahtava karttapalvelu. Sen avulla voi vaikkapa näyttää missä suomalaiset goottikaupat sijaitsevat. Tuollaisen karttasysteemin valjastaminen Textpatternilla päivitettäväksi on loppujen lopuksi melko yksinkertaista. Tarvitaan vain:
Gootti.net:in Goottikaupat kartalla -osion päivittäminen hoidetaan TXP:n kautta. Kartalla näkyvien kohteiden lisääminen, poistaminen ja muokkaaminen on yhtä helppoa kuin minkä tahansa artikkelin hallitseminen TXP:n avulla.
Näin on. Nyt voisin jättää kertomatta miten tämä on mahdollista. Voisin olla neuvomatta tarkemmin. Ihan kiusallani.
Mutta nyt palatkaamme kuitenkin käsiteltävänä olevan asian pariin. Google Maps -systeemin käyttäminen on melko helppoa, kunhan ensin viitsii tutustua systeemin takana toimivaan rattaistoon. Kartan laittaminen nettisivulle vaatii ensin pikaisen toimenpiteen suorittamisen Google Maps API:n suunnalla. Haetaan sieltä halutulle nettisivulle jonkinlainen sarjanumero (virallinen termi lienee Maps API key). Koodilitanian hakeminen onnistuu nopeasti. Ensin lukaistaan palvelun käyttöehdot, hyväksytään ne, jonka jälkeen ilmoitetaan sen nettisivun URL-osoite, jolle anotaan sarjanumero. Sitten lähetetään lomakkeen tiedot napsuttamalla "Generate API key" -nappulaa. Sen jälkeen kun em. lomakkeen tiedot on lähetetty, saadaan esiin karttapalvelun sarjanumero ja kaikenmaailman ohjeistuksia. Otetaan ainakin se sarjanumero talteen. Otetaanpas vielä ne muutkin ohjeet säilöön, kun eihän sitä tiedä miten pieleen näillä minun ohjeillani mennään…
Karttahan saadaan nettisivulle näkyviin laittamalla juuri haettu sarjanumero nettisivun lähdekoodin <head></head>-osion väliin. Lisättävä koodirivi näyttää todennäköisesti / jokseenkin tältä:
<script src="http://maps.google.com/maps?file=api&v=
1&key=tahan-sarjanumero" type="text/javascript"></script>
Yllä näkyvä koodiesimerkki pitää sisällään rivinvaihtoja, joten tuo ei tuollaisenaan toimi. Lisäksi siitä puuttuu toimiva sarjanumero. (Eli koodirivin voi toki kopioida, mutta siihen kannattaa vaihtaa toimiva sarjanumero ja poistaa turhat rivinvaihdot.)
Nyt kun olemme saaneet näin paljon aikaiseksi, voisimme käydä vaikka jääkaapilla hakemassa evästä. On vielä paljon tekemistä, jotta kartta toimisi.
Kartan lähdekoodin sisältöalueelle, ts. <body></body>-palikan väliin, laitetaan haluttuun kohtaan ensin tällaista:
<div id="map" style="height: 100px; width: 100px;"></div>
Tämä koodi on se alue, mihin kartta tulostetaan. Se paikka, mihin kartta tulee näkyviin. Kartta sijoitetaan div-pömpelin sisään. Tässä esimerkkimerkkauksessa kartan kokoa ja leveyttä säädetään CSS-merkkauksen avulla, joka on muljaistu div-elementin sisään. Kartassa on oletusarvoisesti id-selektori, jonka arvo on map. Kun kerran selektori, joka muuten on aika hieno sana, löytyy, siihen voidaan tarttua esim. ulkoisen CSS-tiedoston kautta. Tämän nimenomaisen ja kyseessä olevan div-mötikän sisälle voidaan laittaa tavaraa. Voidaan laittaa esimerkiksi joku teksti-ilmoitus, tyyliin: “Jos näet tämän, karttapalvelu ei toimi.”. Siis esimerkiksi näin:
<div id="map" style="height: 100px; width: 100px;"><p>Kun kerran näet tämän, et näe karttaa. Harkitse paremman nettiselaimen hankkimista.</div>
Jos karttasysteemi toimii, se peittää koko div-palikan alueen ja piilottaa tekstin ja todennäköisesti muut sinne sijoitetut roinat alleen. Karttasysteemihän toimii hyvin pitkälti JavaScript-koodin avulla. Mikäli käyttäjän nettiselaimessa on JS:n suorittaminen evätty, silloin kartta ei toimi.
Tämä juttu onkin odotettua laajempi selittää ja esitellä. Seuraavassa jaksossa laitamme kartan näkymään aikaisemmin mainitun div-elementin kohdalle. Käsittelemme mahdollisesti myös kohteiden lisäämistä kartalle, tai vaihtoehtoisesti sitä miten paljon pikakahvia vatsalaukkuni vetää.
Koska aika on arvokasta, kannattaa tutustua tähän alla näkyvään listaan jos mielit löytää tämän nettisivuston parhaat kirjoitukset. Tässä alapuolella on kaikkein luetuimpia kirjoituksia Korinaa kuopasta -blogin aarreaitasta. Kirjoitukset on järjestetty suosituimmuusjärjestykseen siten, että luettelon kärjessä on tällä hetkellä eniten lukukertoja saaneet kirjoitukset.
Blogimerkintää "Google Maps ja Textpattern: osa 1" muokattiin viimeksi 774 päivää sitten, eli maanantaina 28.12.2009 kello 12:12. Kirjoitukseen on julkaistu kommentteja 4 kpl. Kaikki kirjoituksen saamat kommentit löytyvät suoraan tämän tekstimötikän alapuolelta.
Hehe, jotenkin oudolta tämä tuntuu, kun minä tämän homman tein eilen, mutta oikeastaan en kartalla mitään tehnyt niin poistin tekeleeni heti alkuunsa julkisuudesta. Itse käytin karttaa vierailijoiden osoitteiden näyttämiseen, mutta koska se tuntui aika turhalta niin poistin sen :-)
Tuli muuten vielä mieleen. Jos joku on todella laiska eikä jaksa kirjoittaa tuota div id=“map” -palinkan sisälle selitystä, miksi karttaa ei näy, on tähän luotu txp:n pluginikin joka tuommoisen tekstin valmiina sisältää. Tosin itsessään se plugini on turha – todella turha :)
Näistähän sinun oppaistasi voisi oikeastaan tehdä oikein pdf-muodossa olevan opassarjan :P
Tarkoitatko viritelleesi sellaista karttaa, missä näkyy vierailijoiden katuosoite? Sellainen olisi hieno kyhäelmä. Jos tosiaan vierailijoiden katuosoitteita tarkoitit, niin miten ihmeessä saat kaivettua tarvittavat tiedot? IP-osoitteestako? Tässä kommentissa on näin paljon kysymyksiä sen takia kun en tiedä mistään mitään. :-)
Joskus kesällä oli tarkoitus luoda blogimerkinnöistä iso möhkäle, sellainen PDF-filu, missä on hyödyllisimmät bloggaukset yhdessä paketissa. Jäi kuitenkin toteuttamatta kun niitä ns. “hyödyllisiä” blogimerkintöjä on niin vähän.
Juu, IP-osoitteiden avullahan se toimii. Google Mapissahan on ihan valmiina tuokin mahdollisuus.
Rss-googlemap_stats plugin mahdollistaa TXP:n logeista IP-osoitteiden hakemisen.
Nyt rupesi kiinnostamaan. Eikai sitä tuostavaan voi ip:llä kenenkään kotiosoitetta selvittää? :O
Oho! Tämän julkaisun kommentointi onkin jo suljettu. Kun tämän julkaisun kommentointi oli vielä avoinna, tälle julkaisulle kirjoitettiin yhteensä 4 kommenttia. Tämä artikkeli on lokeroitu kategoriaan Textpattern. Tämän julkaisun kestolinkin osoite on http://www.kuopassa.com/weblog/2006/12/27/google-maps-ja-textpattern-osa-1.
Selaat tällä hetkellä blogimerkintää Google Maps ja Textpattern: osa 1.. Se julkaistiin %. päivä joulukuuta 2006. Voit siirtyä lukemaan blogin tuoreimpia kirjoituksia klikkaamalla tiesi weblogin etusivulle. Tässä blogissa julkaistaan kiinnostaviksi katsomiani asioita, joten jos tiedät kiinnostavan nettiin liittyvän aiheen, josta kannattaisi kirjoittaa, laita palautetta!