Sådan hacker du Googles nye legends

Laver du kort med Google Fusion, har du netop fået muligheden for at få automatiske signaturforklaringer “legends” på kortet. Her gennemgår jeg, hvordan du får dem på – og ikke mindst hvordan du bagefter kan ændre dem, så du får flere variationsmuligheder.

Jeg forudsætter, du du ved, hvordan du laver kort i Google Fusion. Ellers kan du læse mere i denne tutorial. Klik for at se illustrationerne nedenfor i større udgave.

Mange har længe ønsket en nem signaturforklaring, der helt enkelt kan forklare, hvad farverne fx betyder på et kort som dette, der viser andelen af den voksne befolkning, der er registreret som dårlige betalere i RKI.

For at få en signaturforklaring på kortet, skal man bruge Googles “New look”, der indtil videre kører sideløbende med “Classic look”. Man kan stort set de samme ting i de to brugergrænseflader, men fx er muligheden for legends nu kun indført i New look. Skift til New look i højre øverste hjørne:

Gør nu – om nødvendigt – kortet klar i “New look” med det udseende, du ønsker. Indtil videre skal du bruge “Buckets” til at farve kortet op med for at kunne bruge den automatiske signaturforklaring. Når data er visualiseret som et kort, får du adgang til at opsætte signaturforklaringen samme sted, som du styrer udseendet af kortet i øvrigt – under “Tools” og “Change map styles”.

Klikker du på “Automatic legend”, kan du nu styre nogle få ting: Hvor på siden skal signaturforklaringen placeres? Hvad skal overskriften være? Og skal der vises et link til tabellen – i givet fald med hvilken tekst?

Herover har jeg placeret signaturforklaringen i øverste højre hjørne af kortet. Overskriften har jeg valgt skal være “Andel registreret i RKI”, og der kommer et link til tabellen nederst i boksen.

Uden videre vil den altså se sådan her ud. Farverne og intervalinddelingerne bliver taget direkte fra opsætningen af “buckets” i Google Fusion-kortet:

Og hele kortet med signaturforklaringen vil se sådan her ud – fx når det er embeddet på en side:

Som det fremgår, er der ikke mange indstillingsmuligheder. Men har man mod på at kigge en smule i koden bag kortet, er det let at få mere spillerum.

Sørg først for, at kortet kan ses af alle, der har linket. Det betyder ikke, at kortet uden videre bliver offentliggjort eller kan findes i søgemaskiner.

Klik først på den blå “Share”-knap i øverste højre hjørne af skærmen, hvor du ser kortet.

Hvis dit kort p.t. er privat, så klik på “Change” og sørg for, at der som på nedenstående kort står, at “Anyone who has the link can view”. Det er nødvendigt for at kunne gå videre.

Når du har godkendt ændringen ved at trykke på “Done”, skal du finde “Publish” under “Tools”

Klik på “Get HTML and JavaScript”:

Kopier al koden i det vindue, der åbner sig. Sørg for at få det hele med.

Åbn et helt simpelt tekst-dokument. På en pc vil Notepad/Notesblok-programmet være fint. På en mac skal man sørge for at vælge et program, der ikke selv afsætter koder i teksten. Word og lignende duer ikke. På Mac har jeg fx brugt det gratis TextWrangler. Kopier koden ind i tekstdokumentet, og gem det under et passende navn. Navnet skal slutte med “.html”

Sørg for, at der ikke automatisk bliver sat .txt bagefter. I Notesblok-programmet gør man det ved at sige, at filtypen skal være “Alle filer”.

Du kan nu åbne den gemte fil i en browser – dobbeltklik på den eller åbn den med en browser efter eget valg. Koden, du har kopieret ind i tekstdokumentet, henter Google Fusion-kortet og viser det i en forudbestemt størrelse. Størrelse afhænger af, hvad man skrev ud for Width og Height før. Jeg skrev ingenting, så mit kort er indtil videre ret lille: 500 pixel bredt og 300 pixel højt.

Det er for småt, så jeg åbner filen i mit simple teksthandlingsprogram igen – jeg bruger stadig Notesblok.

Tæt på toppen kan man stille størrelsen på kortet.

Man skriver bare den størrelse, man vil have og gemmer igen. Så kan man igen kigge på kortet i en browser og se, om størrelsen er bedre.

På grund af faconen på Danmark, bruger jeg som regel 680 pixel i bredden og 600 i højden.

Hvis ikke man har fået Danmark centreret rigtigt, skal man kigge ned i koden og justere på koordinaterne, indtil udsnittet, man ser i kortvinduet, passer en. koordinaterne står i den linje, der begynder med “center”:

Tallet, der står efter “Zoom:” angiver hvor meget kortet er zoomet ind; jo højere tallet er, jo tættere på jordoverfladen er man.

Du kan hele tiden eksperimentere med at ændre koden – og straks tjekke udseendet af kortet i en browser.

Når du er tilfreds med selve kortets udseende, kan du bearbejde den signaturforklaring, Google nu har lavet.

I toppen af kortet er der lidt kode, der styrer udseendet af skrifttyper, størrelse på signaturforklaringen, ramme etc.:

Og næsten i bunden af koden, er der nogle linjer, hvor man konkret kan ændre den tekst, der står ved siden af interval-farverne mv.

Her har jeg ændret lidt i teksten i koden:

Og resultatet er dette:

Kortet kan sagtens ses og redigeres, mens det ligger på ens personlige computer, men skal andre se det, skal det naturligvis ud på en webserver, ud i en dropbox eller lignende, så andre kan få webadressen.

Jeg har lagt kortet fra denne lille tutorial ud på vores egen webserver, og du kan se det færdige resultat her. Hvis du vil se koden i sin helhed, kan du kigge i den via din browser, typisk via et højreklik.

Som nævnt er der mange muligheder for at arbejde med udseendet af signaturforklaringerne. Den nye “automatiske” signaturforklaring giver en hurtig starthjælp, men hvis man vil kæle mere for sine signaturforklaringer; måske lave en farvet baggrund, lægge et logo ind, tilføje links eller andet, så man man selv bearbejde koden.

Giv os besked, hvis du finder andre måder at bruge Googles nye legend på.

Trackbacks/Pingbacks

  1. 5 tip, der gør dine Google Fusion kort bedre | Kaas & Mulvad - 5. april 2014

    […] Læs hvordan du gør. […]

  2. Derfor virker dit Fusion kort ikke lokalt | Kaas & Mulvad - 7. april 2014

    […] gemme den på sin computer som en html-fil, og man kan så her tilrette legend og andet. Se mere om tilretning af legend. Men Google har ændret i koden, så man ikke umiddelbart ser noget, hvis man blot åbner […]

Skriv et svar

This site uses Akismet to reduce spam. Learn how your comment data is processed.