1. Giv siden en overskrift, relevant preheading (Modul eller Funktionalitet) og intro
    1. Supplér eventuelt med brødtekst, hvis der er information udover Sådan gør du-guide
  2. Udfyld relevant Sådan gør du-accordion
    1. Tre overelementer - læseren skal grundlæggende kunne sætte modulet op/bruge funktionen blot ved at læse disse tre trin
      1. Videoer lægges i underelementer
        1. Undgå at bruge billeder så vidt det er muligt. Videoerne skal være det primære visuelle element i guiden - eventuelle billeder skal blot flettes ind i brødteksten*
      2. Yderligere information, der ikke direkte er nødvendig for at kunne bruge modulet/funktionen lægges også i underelementer
  3. For modulartikler opsættes eksempel i Eksempel på modul i brug-containeren
    1. Opsætning herunder er valgfri, så længe eksempelelementerne ligger under disclaimer-boksen
      1. Du kan fx sætte eksempel op for sig selv, eller i sin egen container, accordion, etc. Du må gøre hvad du vil i dette område, så længe man kan se modulet i praksis, og i flere versioner hvor relevant
  4. Husk at tilføje brugsscenarier i boksen i højrekolonnen
  5. Hvis der er et godt tip eller anden god, ekstra viden omkring modulet eller funktionen, kan du tilføje i Godt at vide...-boksen. Den ligger som standard i højrekolonnen, men kan rykkes alt efter hvad der giver mening
  6. Husk at kategorisere siden inden lancering

*Kan faktisk godt lide at supplere brødtekst med billeder, synes bare det ser ret kluntet ud lige nu, fordi man ikke kan strømline eller styre billedstørrelser i CMS'et. Hvis vi kan sætte et system op, hvor billeder altid produceres på samme måde og i samme størrelse og opløsning, så måske. Det vil nok være et projekt i sig selv.

Modul

Grafmodulerne i GoPublic

03-07-2025

I denne vejledning får du et overblik over de seks grafmoduler, du kan bruge i GoPublic. Du finder også en trin-for-trin-guide til, hvordan du sætter grafmodulet op.

I GoPublic har du seks forskellige diagramtyper at vælge imellem:

  • Cirkeldiagram
  • Linjediagram
  • Søjlediagram
  • Donutdiagram
  • Radardiagram
  • Boblediagram

Her gennemgår vi styrker og svagheder ved de enkelte diagrammer, hvordan de bedst anvendes, og hvad du skal være særligt opmærksom på. Til sidst finder du en trin-for-trin-guide til, hvordan du bruger grafmodulerne i GoPublic.

Tilpasning af farver

Inden du begynder at arbejde med modulerne, kan du i Charts-konfigurationen redigere de farver, der bruges i dine diagrammer. Her kan du definere et farvesæt, der passer til dit visuelle udtryk.

Vær dog opmærksom på:

  • Tilgængelighed: Farverne skal overholde regler for kontrastforhold, så alle brugere kan aflæse grafen.
  • Konsistens: Brug gerne de samme farver til de samme kategorier på tværs af grafer, så brugeren hurtigt kan genkende mønstre.
  • Undtagelser: Hvis du har brug for helt unikke farver til en enkelt graf, kan du også tilpasse farverne direkte i modulet – uden at ændre standardfarverne for hele sitet.
Pie Chart

Cirkeldiagram


Viser procentvis fordeling af en helhed, opdelt i udsnit. Bedst til et begrænset antal kategorier (helst under 8).

Eksempler på brug:

Budgetfordeling mellem sektorer (sundhed, uddannelse, infrastruktur m.m.)
Fordeling af ansøgningstyper i en myndighed
Befolkningssammensætning efter alder, uddannelse eller beskæftigelse
Fordele: Hurtigt at aflæse, når antallet af kategorier er lavt.
Ulemper: Bliver hurtigt uoverskueligt med mange kategorier eller meget små udsnit.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere.

Du kan importere en CSV-fil, hvis du allerede har dataene klar i sådan et format, eller du kan manuelt tilføje og udfylde værdierne. Navnet bliver som standard vist under diagrammet. 

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu
Line Chart

Linjediagram


Bruges til at vise udvikling over tid. X-aksen repræsenterer tid, Y-aksen viser værdierne.

Eksempler på brug:

Udvikling i antal borgere, der benytter en service (bibliotek, borgerservice, hospitaler)
Trafikudvikling måned for måned
Miljødata som luftforurening eller CO₂-udledning over tid
Fordele: Meget velegnet til at vise trends og sammenligne flere udviklinger.
Ulemper: Data skal have en logisk, jævn tidsmæssig progression for at give mening.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere. Du kan:

  • Tilføje nye værdirækker, f.eks. for forskellige kategorier eller tidspunkter (Add row)
  • Tilføje flere værdikolonner, f.eks. når du vil vise flere dataserier i samme graf (Add column)
  • Indlæse data direkte fra en fil i stedet for manuelt (Import CSV)
  • Fylde området under en linjegraf for at skabe en flade fremfor blot en linje (Fill The Area Under The Line)
  • Glatte grafens linjer, så de får et mere kurvet udseende (Smooth Lines)
  • Angive et maksimalt interval, grafen skal forholde sig til (Suggested Maximum Value)
  • Angive et minimumsinterval, grafen skal forholde sig til (Suggested Minimum Value)
  • Navngive den vandrette akse, så brugerne forstår hvad værdierne repræsenterer (X-axis Label)
  • Navngive den lodrette akse, så brugerne forstår hvad værdierne repræsenterer (Y-axis Label)
  • Lægge dataserier oven på hinanden i stedet for side om side (Show as Stacked)
  • Begrænse antallet af viste etiketter på den vandrette akse (Don’t Show All X-axis Labels)
  • Vise hjælpelinjer i baggrunden, så det bliver lettere at aflæse værdierne (Show Grid Lines)

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu
Bar Chart

Søjlediagram


Bruges til at sammenligne værdier på tværs af kategorier.

Eksempler på brug:

Sammenligning af kommuners CO₂-udledning eller sociale ydelser
Udgifter til forskellige offentlige projekter
Antal behandlede sager inden for forskellige områder
Fordele: Meget let at aflæse og sammenligne.
Ulemper: Kan blive for rodet, hvis der er alt for mange kategorier på én gang.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere.

  • Tilføje nye rækker med værdier (Add row)
  • Tilføje ekstra kolonner med dataserier (Add column)
  • Indlæse dine data direkte fra en fil (Import CSV)
  • Vise baggrundslinjer, som hjælper brugeren med at aflæse værdier (Show Grid Lines)
  • Sætte en øvre grænse for værdierne på aksen (Suggested Max Value)
  • Sætte en nedre grænse for værdierne på aksen (Suggested Min Value)
  • Navngive den vandrette akse for at tydeliggøre, hvad værdierne repræsenterer (X Axis Label)
  • Navngive den lodrette akse for at tydeliggøre, hvad værdierne repræsenterer (Y Axis Label)
  • Begrænse antallet af viste etiketter på den vandrette akse (Don’t Show All X-Axis Labels)
  • Bestemme bredden på søjlerne i diagrammet (Bar Width)
  • Placere søjler oven på hinanden i stedet for ved siden af hinanden (Show as stacked)

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu
Doughnut Chart

Donutdiagram


Ligner cirkeldiagrammet, men med et hul i midten. Bruges til at vise fordeling af en helhed.

Eksempler på brug:

Fordeling af arbejdstimer på forskellige opgaver
Energiforbrug i offentlige bygninger
Fordeling af udgifter på drift, vedligeholdelse og investeringer
Fordele: Mere overskuelig visning end et cirkeldiagram, da midten giver luft.
Ulemper: Samme begrænsning som cirkeldiagrammer: bedst til få kategorier.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere.

Du kan importere en CSV-fil, hvis du allerede har dataene klar i sådan et format, eller du kan manuelt tilføje og udfylde værdierne. Navnet bliver som standard vist under diagrammet. 

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu
Radar Chart

Radardiagram


Viser flere egenskaber for én eller flere enheder på en flerakset graf. Bruges ofte til at fremhæve styrker og svagheder.

Eksempler på brug:

Evaluering af kommunale serviceområder (borgerbetjening, sundhed, miljø m.m.)
Medarbejderevaluering på tværs af kompetenceområder
Benchmarking af regioners performance på forskellige parametre
Fordele: God til at sammenligne mange parametre samtidig.
Ulemper: Kan være svært for utrænede brugere at aflæse.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere. Du kan:

  • Tilføje nye rækker med data (Add row)
  • Tilføje flere dataserier i grafen (Add column)
  • Importere data direkte fra en fil (Import CSV)
  • Angive en øvre værdi, som aksen skal skaleres efter (Suggested Maximum Value)
  • Angive en nedre værdi, som aksen skal skaleres efter (Suggested Minimum Value)

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu
Bubble Chart

Boblediagram


Viser relationen mellem tre datasæt på én gang. X- og Y-aksen viser to variable, mens størrelsen på boblen repræsenterer den tredje.

Eksempler på brug:

Kommuners størrelse vs. budget og antal institutioner
Sammenhæng mellem sociale investeringer og effekt (fx hjemløshed vs. boligprojekter)
Transportanalyser (indbyggertal, transportmidler og budget)
Fordele: God til at vise komplekse relationer.
Ulemper: Kan blive uoverskuelig, hvis boblerne overlapper meget.

Sådan bruger du modulet

Denne guide gennemgår en standardopsætning af modulet og hjælper dig godt i gang med de mest centrale felter og funktioner. Husk at du også i mange tilfælde kan læse mere om specifikke felter via hjælpeteksterne i GoPublic. Hvis du ikke ved, om eller hvordan du slår hjælpetekster til, så kan du læse om dem i introforløbet.

Du kan trække modulet ind i hvilket som helst felt på siden, og ændre bredden som det passer dig.

Du finder modulet i oversigten under Media & Visuals.

Dobbeltklik på modulet for at åbne redigeringsvinduet, og fortsæt til Trin 2: Redigér modulet  i denne guide.

Når du har dobbeltklikket på modulet og åbnet det grundlæggende redigeringsvindue, kan du gå i gang med at opsætte indhold. 

Husk, at du undervejs altid kan få et preview af modulets opsætning via Preview-knappen som kan tilgås i modulets redigeringsvindue. Hvis du gerne vil se modulets opsætning i relation til resten af sidens indhold, kan du gemme og publicere siden, og gå til siden. Så kan du se modulet, som besøgende på siden vil kunne se den. Vær dog opmærksom på, at publicering af siden som standard betyder, at siden altså er live og derfor også i praksis kan tilgås af besøgende, men hvis du hurtigt afpublicerer siden igen, vil du som regel kunne undgå uvedkommende besøg. 

Hvis du gerne vil arbejde på en live-side, men uden at besøgende skal kunne tilgå siden, kan du afkrydse "Exclude page from external search results" i SEO-panelet under sidens Settings-fane. Det forhindrer ikke personer med et direkte link eller kendskab til sidens præcise URL i at finde siden, men hvis du arbejder på en ny side som ikke er blevet annonceret, så er der ikke en stor risiko. Husk som minimum at gemme siden efter afkrydsning, så valget bliver gemt. Det slår derefter til ved næste publicering.

Det er her i Settings at du udfylder den data, som diagrammet skal visualisere. Du kan:

  • Tilføje nye rækker med datasæt (Add row)
  • Indlæse dine data direkte fra en fil (Import CSV)
  • Sætte en øvre grænse for værdierne på den lodrette akse (Suggested Y-axis maximum value)
  • Sætte en nedre grænse for værdierne på den lodrette akse (Suggested Y-axis minimum value)
  • Sætte en øvre grænse for værdierne på den vandrette akse (Suggested X-axis maximum value)
  • Sætte en nedre grænse for værdierne på den vandrette akse (Suggested X-axis minimum value)
  • Navngive den vandrette akse, så det bliver tydeligt hvad værdierne repræsenterer (X-axis Label)
  • Navngive den lodrette akse, så det bliver tydeligt hvad værdierne repræsenterer (Y-axis Label)

Structure kan du tilføje og påvirke aspekter af modulet, der ikke direkte er den visualiserede data. Du kan:

  • Give diagrammet en overskrift (Headline)
  • Tilføje supplerende brødtekst (Body)
  • Tilføje en beskrivende alt-tekst, som skærmlæsere kan læse op (Description for Accessibility)
  • Skjule værdiernes navne, så blot er diagrammet der bliver vist (Hide legend)
  • Tilføje en note, som bliver vist under diagrammet (Note)
  • Vise en popup-hjælpetekst når man holder musen over elementerne i diagrammet, som udstiller værdien i tal (Tooltip Display)
  • Tilpasse modulets højde ved mobilvisning (Height in Mobile View)
  • Tilføje en downloadknap, så brugere kan hente dataene ned i en CSV-fil (Show 'Download' Button)
  • Bestemme den enhed, som værdierne udgør, fx. kilo, kroner, stk, osv. (Tooltip Unit)

Presentation har du mulighed for at indstille forhåndsbestemte CSS-klasser på modulet, som påvirker det visuelle udtryk. Vær opmærksom på, at valgmulighederne her afhænger af, hvad der er lavet i designprocessen, men der er som regel nogle basismuligheder, eksempelvis at indramme modulet i en 'kasse', eller at give modulet en skygge, så det "løfter" sig fra baggrunden.

Når du er færdig med at redigere i modulet, skal du gemme modulopsætningen, og herefter kan du:

  • Gemme og publicere indholdssiden på ny, hvis du er klar til at lancere modulet på live-versionen af siden
  • Blot gemme indholdssiden, hvis du vil sikre, at modulet og dets opsætning forbliver på siden, men uden at besøgende på live-versionen kan se eller tilgå det endnu

Eksempel

I dette område kan du se et eller flere eksempler på det opsatte modul, så du kan få en fornemmelse for, hvordan det kan se ud på din hjemmeside.

Cirkeldiagrammer viser procentvis fordeling af en helhed og egner sig bedst til visualisering af få kategorier.

Fordeling af budgettet

Dette eksempel viser, hvordan et budget fordeler sig på forskellige udgiftsposter. Cirkeldiagrammet giver et hurtigt indtryk af, hvilke poster der fylder mest i det samlede billede.

Linjediagrammer viser udvikling over tid og egner sig godt til visualisering af trends og sammenligninger.

Antal besøgende pr. måned

Dette eksempel viser, hvordan antallet af besøgende på et website har udviklet sig måned for måned i 2024 og 2025. Linjediagrammet gør det nemt at sammenligne år med år og se tendenser i væksten.

Søjlediagrammer sammenligner værdier på tværs af kategorier.

Salgstal pr. produktkategori

Her sammenlignes salgstal på tværs af forskellige produktkategorier. Søjlediagrammet gør det tydeligt, hvilke kategorier der klarer sig bedst, og hvor der er potentiale for vækst.

Donutdiagrammer er en version af et cirkeldiagram, men med et tomt felt i midten, som bidrager til visuel overskuelighed.

Fordeling af medlemstyper

Dette eksempel viser fordelingen af medlemmer i en organisation opdelt efter medlemskaber. Donutdiagrammet gør det let at se, hvilken medlemskategori der dominerer, samtidig med at midten kan bruges til at fremhæve totalen.

Radardiagrammet sammenligner flere parametre for én eller flere enheder.

Evaluering af medarbejderkompetencer

Dette eksempel viser en kompetencevurdering af to medarbejdere. Radardiagrammet giver et visuelt overblik over styrker og svagheder på tværs af flere parametre og gør det nemt at se forskelle mellem profilerne.

Boblediagrammer viser sammenhænge mellem tre variable: størrelse, placering og værdi.

Virksomheder fordelt på omsætning, antal ansatte og markedsandel

I dette eksempel vises virksomheder fordelt på deres omsætning (X-akse) og antal ansatte (Y-akse), mens boblernes størrelse viser markedsandel. Diagrammet gør det nemt at afkode, hvem der er store spillere på markedet, og hvor de placerer sig i forhold til hinanden.

Nyttig til...

Godt at vide...

Relaterede undervisningsforløb

Godt at vide

Om CSS-klasser

I modulets indstillinger har du mulighed for at vælge mellem op til flere forskellige CSS-klasser, som påvirker modulets visuelle udtryk. Vær opmærksom på, at valgmulighederne varierer mellem moduler, og hvad der er indgået af aftaler i forbindelse med hjemmesidens design.

Indhold

Har du brug for hjælp?

Fandt du ikke hvad du søgte, eller har du brug for hjælp, kan du kontakte vores supportteam.

Opret sag i Zendesk

Er problemet akut?

Så tøv ikke med at ringe til os:

+45 6169 9796

Telefontider:


Man-fre: 9.00 - 16.00