← Tilbake

ⓘ Om Udir-kart

Udir-kart er en interaktiv plantegning for Udirs lokaler i Oslo. Løsningen er helt statisk (ingen serverkode) og hostes på Azure Storage Static Website.

🙋 Hjelp og Funksjonalitet

Løsningen er optimalisert for PC, nettbrett og mobil. Her lister vi opp de viktigste funksjonene:

• Søk & Romvalg: Begynn å skrive navn eller romkode (f.eks. «Smia» eller «0788»). Enter hopper direkte til treff. Ved valg av rom (fra søk, liste eller kart), sentreres kartet automatisk.
• Kartinteraksjon (PC):
  • Zoom: Bruk musehjulet eller knappene + / − øverst til høyre.
  • Panorering/Bevegelse: Hold nede Mellomrom (Space) mens du klikker og drar musen. Uten Mellomrom er kartet låst for tegning/seleksjon.
  • Hover: Hold musen over et rom for å se navn og kode.
• Kartinteraksjon (Mobil):
  • Zoom: Bruk to fingre ("pinch-to-zoom") eller knappene + / − øverst til høyre.
  • Meny (Bottom Sheet): Dra håndtaket nederst for å åpne/lukke listevisningen. Menyen lukkes automatisk ved valg fra listen.
  • Visuell Feedback: Ved trykk på et rom på kartet, vises en **permanent label** rett over rommets øverste kant, uten å dekke rommet.
• Etasje: Bytt med rullegardinmenyen, eller bruk Ctrl+↑/Ctrl+↓ (PC).
• Tøm & Del:
  • Opprydding: Trykk på X eller Esc for å fjerne aktiv markering og tømme søk. Kartvisningen blir stående der du har zoomet den.
  • Del lenke: Bruk lenke-ikonet til høyre i søkefeltet for å kopiere lenke til valgt rom/sone (URL med #r=… eller #z=…).
• Admin-funksjonalitet: Krever Admin-tilgang. Tillater nøyaktig tegning av nye polygoner, lagring av lokale data og eksport som så kan lagres som en json-fil i en egen folder på serveren.

🤓 Hvem har laget det

Prosjektet er laget internt i Udir av Are Mjølsnes (som til daglig jobber med Grep). ChatGPT (openAI) og Gemini (Google) har bistått som «teknisk skribent og koderedigerer». Kudos til Sigmund i ITD for tumleplass i Azure! Han har også fikset en URL som er lett å huske: udir-kart.udir.no. Takk også til Camilla (ITD) for tilgang til plantegningene.

Melding til sjefen: Tidsbruken har vært minimal. Hoveddelen er gjort på en ettermiddag/kveld – mest på fritiden.

Motivasjon: Undertegnede virrer rett som det er rundt som en forvirret høne for å finne møterom. Derfor altså en høne som «favicon» (ikonet ser du i fanen øverst i nettleseren). Jeg tenkte: Er det nyttig for meg, er det kanskje nyttig for flere.

👨‍🔧 Hvordan det er laget

• Frontend: ren HTML, CSS og JavaScript (uten rammeverk)
• Ingen byggsteg eller runtime-avhengigheter
• Hostes via Azure Storage Static Website
• Data: data/rooms.json (polygoner for rom og soner)
• Interaktivt lag: SVG-overlay for markering og klikk

📚 Dokumentasjon og kildekode

Full dokumentasjon (arkitektur, dataskjema m.m.) ligger i GitHub-repoet:
- github.com/Utdanningsdirektoratet/udir-kart (lenken fungerer kun for de med tilgang til Udirs GitHub-repo)