Moderne kart er ikke lenger bare statiske bilder: i dag kan du legge dem over hverandre tilpassede lag, varmekart og avanserte visualiseringer som omdanner dataene dine til tydelig og handlingsrettet informasjon. Enten du jobber med kundelokasjoner, forbrytelser, tekniske hendelser eller brukeratferd på et nettsted, kan en god implementering av disse lagene utgjøre forskjellen mellom å se isolerte datapunkter og oppdage reelle mønstre.
I denne artikkelen skal vi se, i detalj og med en praktisk tilnærming, hvordan tilpassede lag og varmekart på forskjellige karttyperFra kart-API-er som Google Maps, QGIS og Azure Maps, til webanalyse-varmekart som Hotjar og WordPress-pluginer, lærer du hva de er til for, fordelene deres, hvordan du konfigurerer dem riktig og når du skal bruke dem – eller unngå dem.
Hva er et varmekart, og hva brukes det til i kartografi?
Et geografisk varmekart er en måte å visualiser intensiteten eller tettheten av data på et kart ved hjelp av farger. Områder med en høyere konsentrasjon av prikker vises med varmere toner (rødt, oransje), mens områder med lavere tetthet vises med kaldere farger (grønt, blått eller grått, avhengig av stilen).
Denne typen visualisering er ideell når du jobber med data fra svært tette, overlappende punkterSteder for forbrytelser, trafikkulykker, hjem, felthendelser, IoT-sensorer, kunder osv. I stedet for å se tusenvis av individuelle markører som ikke forteller deg noe, ser du fargede flekker som gjør det tydelig med et blikk hvor hendelsene er konsentrert.
Nå er et varmekart først og fremst et visuelt verktøy, ikke en presis tetthetsanalyseDet er perfekt for å utforske data eller raskt presentere dem for ikke-tekniske personer, men når du trenger eksakte kvantitative resultater er det vanligvis bedre å gå videre til en mer formell tetthetsberegning (f.eks. estimering av kjernetetthet på et raster).
Implementering av varmekart med Google Maps API
Innenfor Googles økosystem, Kart-API for JavaScript har tilbudt i årevis en spesifikt lag av HeatmapLayer å vise varmekart direkte på et interaktivt kart. Selv om denne funksjonaliteten er merket som foreldet og ikke lenger vil være tilgjengelig i mai 2026, er bruken og konseptene fortsatt svært nyttige, og kan replikeres i dag ved hjelp av tredjepartsbiblioteker som deck.gl.
Laster inn visningsbiblioteket
Google Maps-varmekartlaget lastes ikke inn som standard: det er en del av biblioteket. google.maps.visualiseringFor å bruke den, må du legge til den tilsvarende parameteren i innlastings-URL-en for Maps JavaScript API, inkludert tilbakekallingen som initialiserer kartet.
Den generelle ideen er å laste inn API-skriptet med noe slikt som: en URL med parameteren libraries=visualization og en initMap-funksjon som et tilbakekall. Når biblioteket er lastet inn, vil du ha HeatmapLayer-klassen tilgjengelig for å lage varmekartet ditt.
Grunnleggende oppretting av et varmekartlag
Den typiske prosessen for å lage et varmekart med API-et er ganske enkel: først initialiserer du basiskartet, deretter bygger du en liste over punkter, og til slutt oppretter du varmelaget og knytter det til kartet.
I praksis definerer du en rekke objekter google.maps.LatLng med koordinatene Fra punktene dine (for eksempel flere steder i San Francisco) konfigurerer du kartet med sentrum, zoomnivå og karttype, og oppretter et nytt objekt google.maps.visualization.HeatmapLayer som sender listen over punkter som en dataegenskap. Til slutt kaller du setMap(map) slik at dette laget vises på kartet.
Resultatet er et fargeoverlegg på satellitt- eller gatekartet der Områder med høyere konsentrasjon av punkter vil virke "varmere", etter standard fargegradient eller den du definerer.
Vektede data: LatLng vs. Vektet plassering
Google Maps API for JavaScript lar varmekartlaget fungere ikke bare med enkel LatLng, men også med objekter Vektet PlasseringBegge representerer et punkt på kartet, men WeightedLocation legger til en vektegenskap som kontrollerer «styrken» som punktet bidrar med til varmekartet.
Som standard fungerer hver LatLng som om den hadde en implisitt vekt på 1Hvis du bruker én WeightedLocation med vekt: 3 i stedet for å legge til det samme LatLng-punktet tre ganger, vil effekten på kartet være tilsvarende, men mer effektiv når det gjelder ytelse, spesielt ved håndtering. store datamengder på ett sted.
Denne vektingen er nyttig i situasjoner som: fremheve omfanget av visse hendelser (for eksempel mer intense jordskjelv), representerer flere observasjoner på samme sted uten å gjenta punkter, eller gir større betydning til kritiske hendelser sammenlignet med mindre hendelser.
Videre er det mulig å blande dem i samme array LatLng- og WeightedLocation-objekterPå denne måten kan du la de fleste punktene ha standardvekt og fremheve bare noen få viktige hendelser ved å øke vekten deres.
Tilpasningsalternativer for varmekartlag
HeatmapLayer-klassen tilbyr flere alternativer for justere utseende og oppførsel av laget. Noen av de viktigste er:
- forsvinnerDenne innstillingen angir om varmekartet skal "forsvinne" når du zoomer. Med verdien satt til sann (standard), forblir radiusen i piksler konstant, og når du zoomer inn, opptar flekkene mindre geografisk område. Hvis den er satt til usann, øker radiusen med zoom for å bevare fargeintensiteten på et bestemt sted.
- gradientDette lar deg definere fargegradienten som en rekke CSS-strenger (f.eks. RGBA-verdier). Dette gir deg full kontroll over hvordan du lager jevnere, mer aggressive eller tilpassede varmekart som matcher applikasjonens visuelle identitet.
- maksintensitetSom standard skaleres farger dynamisk basert på den maksimale konsentrasjonen av punkter i en piksel. Med dette alternativet kan du angi en maksimal statisk intensitet, veldig nyttig når det er veldig høye avvikere som forvrenger hele kartet.
- radius: definerer påvirkningsradiusen til hvert punkt i piksler. Små radier viser svært konsentrerte hotspots, mens store radier jevner ut kartet og genererer bredere flekker.
- opacity: kontrollerer den totale opasiteten til varmelaget, med verdier mellom 0 og 1. Å senke opasiteten kan få en bedre oversikt over basiskartet og andre elementer det er under.
Sammen lar disse parameterne deg skreddersy visualiseringen for varmekartet Svar på nøyaktig det du vil fremhevehøy punktkonsentrasjon, svært omfattende mønstre, små forskjeller mellom områder, osv.
Slutt på støtte og alternativer med deck.gl
Det er viktig å huske på det HeatmapLayer-laget i Google Maps JavaScript API er avskrevet.Funksjonen ble avviklet i mai 2025 og vil bli fullstendig fjernet i en fremtidig API-utgivelse planlagt til mai 2026.
Alternativt anbefaler Google å bruke Integrasjoner med tredjepartsbiblioteker som deck.glDisse løsningene inkluderer en implementering av HeatmapLayer og andre avanserte lag. De muliggjør opprettelse av visualiseringer av høy kvalitet på kart, med støtte for... komplekse data, store volumer og animasjonerog de integreres godt med moderne rammeverk for webutvikling.
Avanserte varmekart og tilpassede lag i QGIS
Når du trenger å gå et skritt videre og gjøre mer fullstendig og nøyaktig romlig analyseQGIS er et referanseverktøy. Det lar deg style punktlag med en "live" varmekart-renderer, og også generere kjernetetthetsraster for mer formell analyse.
Stiliser et punktlag som et varmekart
Tenk deg at du jobber med en CSV-fil med steder med kriminalitet i Surrey (Storbritannia)Arbeidsflyten i QGIS ville i store trekk være:
Først laster du inn et basiskart, for eksempel OpenStreetMap-laget fra XYZ Tiles-delendra den til hovedlerretet. Importer deretter CSV-dataene fra Data Source Manager ved å bruke fanen med avgrenset tekst, og spesifiser den nedlastede filen (for eksempel 2019-02-surrey-street.csv).
QGIS oppdager automatisk kolonnene til Lengdegrad og breddegrad for å definere geometrienReferansesystemet er vanligvis satt til EPSG:4326 – WGS 84. Etter at du har lagt til laget, vil du se hendelsespunktene på basiskartet, men med så høy tetthet er det vanskelig å forstå konsentrasjonen av forbrytelser.
For å konvertere denne punktskyen til et varmekart, åpner du Lagstilpanelet Velg punktlaget og endre plottypen til «Varmekart». Laget vil da vises med en fargerampe (vanligvis grå som standard), og du kan justere innstillingene mens du ser endringene i sanntid.
Valg av fargerampe og påvirkningsradius
I et typisk varmekart bruker folk vanligvis en skala gulrød eller hvitrød slik at de mest intense områdene visuelt «popper». I QGIS kan du for eksempel velge «Røde»-rampen fra rullegardinmenyen for fargerampe i stilpanelet.
Nøkkelparameteren er radioDette definerer det sirkulære området rundt hvert punkt der punktet utøver sin innflytelse. I data som for eksempel forbrytelser eller hendelser har denne verdien mye fysisk betydning: for eksempel kan du anta at en hendelse har en innvirkning innenfor en radius på 5 km fra plasseringen.
Hvis prosjektet ditt er i et system som EPSG:3857 (Web Mercator), er enhetene meter, så du ville angi 5000 som radio for de 5 km. Endring av denne parameteren endrer tydelig kartets glatthet: svært små radier genererer svært lokale flekker; store radier produserer bredere og mer diffuse områder.
Bak denne beregningen ligger en kjernefunksjon som definerer hvordan påvirkningen avtar fra sentrum av punktet til kanten av radiusen. QGIS sin varmekart-gjengiver bruker en kvartisk kjerne som standard, men det finnes andre som Triangular, Uniform, Triweight eller Epanechnikov, som du kan bruke når du genererer varmekart gjennom kjernetetthetsbehandlingsalgoritmen.
Justere opasitet og bruke vektfelt
For å se både basiskartet og varmelaget samtidig, kan du redusere varmekartlagets opasitet Fra lagrepresentasjonsdelen, for eksempel, til 60 %. På denne måten kan du fortsatt se gater, bygninger eller administrative grenser.
I noen analyser er det tilstrekkelig å vurdere punkttetthet som sådanMen i andre tilfeller er det viktig at hvert punkt har en ulik vekt. En voldskriminalitet, for eksempel, bør ikke vektes det samme som et mindre tyveri, eller ett punkt kan representere flere akkumulerte observasjoner.
QGIS lar deg legge til en numerisk vektfelt til attributttabellen og bruk den i varmekartrepresentasjonen. En elegant måte å gjøre dette på er å opprette et virtuelt felt med feltkalkulatoren: velg alternativet for å opprette et nytt felt, kall det «vekt», velg heltallstype og bruk et CASE-uttrykk for å tilordne forskjellige vekter i henhold til forbrytelsestypen (ved å bruke feltet «Forbrytelsestype»).
Når du bruker dette uttrykket, genereres et nytt virtuelt attributt uten å endre de opprinnelige dataene. I stilpanelet kan du angi at punktene er vektet av vektfeltetResultatet er et varmekart som ikke bare gjenspeiler antall hendelser, men også deres relative alvorlighetsgrad.
Generer rastervarmekart med kjernetetthetsestimering
Når du trenger et mer robust resultat for analyse eller rapportering, kan du bruke algoritmen til i stedet for å bare stole på visualisering på skjermen. Varmekart (kjernetetthetsestimat) i delen for prosessverktøy i QGIS. Denne algoritmen genererer et rasterlag med beregnede tetthetsverdier.
Før du kjører algoritmen, anbefales det å projisere punktlaget på nytt til en SRC-prosjektert passende for områdetfordi det ikke er egnet å beregne avstander ved hjelp av geografiske koordinater. For eksempel, for data i Storbritannia, er et vanlig alternativ EPSG:27700 (OSGB 1936 / British National Grid).
Etter reprojisering (ved hjelp av prosessen «Reprojiseringslag»), oppretter du det nye laget og deaktiverer originalen for å unngå forvirring. Deretter søker du etter Heatmap-algoritmen (kjernetetthetsestimering), definerer radius (for eksempel 5000 meter), vektfeltet (vekt (hvis du opprettet den) og pikselstørrelsene i X og Y (for eksempel 50 meter). Du lar standard quad-kjernen stå eller justerer den i henhold til analysens behov.
Når algoritmen kjøres, genereres et nytt rasterlag (for eksempel kalt OUTPUT). I utgangspunktet vises det vanligvis med en enkeltbånds gråtone-gjengivelse noe som ikke er særlig tiltalende. Fra stilpanelet kan du endre gjengivelsen til «Enkeltbånds pseudofarge», velge en rampe igjen, som «Røde farger», og justere kontrasten til du får et visuelt tydelig og nyttig varmekart.
Bruk av varmekart i forretningsgeografisk analyse
Utover skrivebords-GIS inkluderer mange bedriftsmiljøer Visualiseringer av varmekart på interaktive paneler å analysere forretningsdata. Et typisk eksempel er å studere inntekter per region eller salgspotensialet til en detaljhandelskjede.
Disse varmekartene lar oss svare på spørsmål som: Hvor er kundene med størst forbruk konsentrert? I hvilke områder er hendelsene hyppigst? Hvilke regioner har størst vekstpotensial?Imidlertid forstås de vanligvis som et visuelt hjelpemiddel, og det anbefales å utfylle dem med andre grafer som tidsserier, sammenligningstabeller eller histogrammer.
Analyseplattformer anbefaler generelt at hvis kartet har mer enn omtrent 2000 poengI stedet for å vise et direkte varmekart, er det å foretrekke å bruke en tetthetsberegning eller en annen type aggregering. Dette unngår ytelsesproblemer og resulterer i en mer stabil representasjon.
Samhandling med paneler: filtre, valg og synkronisering
I mange BI- eller romlige dataanalyseverktøy settes varmekart inn som kort eller widgeter i et dashbordDisse komponentene tilbyr en rekke kontroller for å få mest mulig ut av visualiseringen:
- Panel Lagalternativer Den lar deg utvide tegnforklaringer, endre symbolikk, endre felt og få tilgang til parametere som utseende, filtre eller attributter.
- Fanen legende Den viser fargegradienten og verdien som er knyttet til ekstremene, noe som gjør det lettere å forstå hva som anses som «høyt» og «lavt».
- Fra fanen til symbologi Du kan endre feltet som brukes til å bygge varmekartet, eller konvertere visualiseringen til en annen type kart (f.eks. koropleter, enkle punkter osv.).
- Fanen utseende Den tilbyr visuelle justeringer: bakgrunnsfarge, forgrunnsfarge, kortkant, kartrotasjon, inkludering eller ekskludering av basiskartlag og nordpilen.
- I fanen attributter Detaljene til de valgte enhetene konsulteres, ideelt når du vil gå fra den generelle oversikten til de spesifikke detaljene.
I tillegg finnes det vanligvis spesifikke knapper for: filtrer data i selve kortetVelg enheter med forskjellige verktøy (enkeltklikk, rektangel, lasso), zoom inn på det merkede området, inverter det, endre visningstype (fra kart til søylediagram, tabell osv.), synkroniser omfanget av flere kart, maksimer kortet eller aktiver kryssfiltre (slik at det du velger på ett kort filtrerer resten).
Varmekartlag og georefererte bilder i Azure Maps
Azure Maps tilbyr avanserte funksjoner for arbeid med varmekartlag og bildelag om interaktive kart på nettet, rettet mot utviklere som bygger løsninger i Azure-økosystemet.
Visualisering av tetthet med varmekartlag
Varmekartlag i Azure Maps brukes til å representere punkttetthet ved bruk av en rekke fargerSom i andre systemer tillater de deteksjon av "hotspots" der konsentrasjonen av hendelser eller verdier er høyere.
Disse lagene støtter vektede datapunkterDette betyr at hver enhet kan ha en verdi som indikerer dens relative betydning. Dette lar deg fremheve for eksempel sensorer med ekstreme avlesninger, kunder med høyest kjøpsvolum eller mer alvorlige hendelser innenfor samme datalag.
Azure Maps tilbyr detaljert dokumentasjon og kodeeksempler for å legge til og konfigurere disse lagene, og dekker aspekter som Justering av fargegradienter, radier, intensiteter og stilerVed å integrere dem med Azure-data-API-er blir de et kraftig verktøy for å overvåke informasjon i sanntid.
Bildelag for å legge planer, gamle kart eller droneopptak over hverandre
Azure Maps-bildelaget tillater overlapping georefererte bilder som beveger seg og skalerer sammen med basiskartet når du zoomer og panorerer. Denne funksjonaliteten er svært nyttig når du trenger å kombinere moderne kartografi med tilpassede lag, for eksempel:
- Plantegninger av bygninger eller industrianlegg, som du kan bruke til å finne utstyr, rømningsveier eller sensorer innenfor et bestemt område.
- Historiske kart, i samsvar med nåværende kartografi for å sammenligne hvordan territoriet har endret seg over tid.
- Bilder tatt av dronerFor eksempel for å inspisere avlinger, infrastruktur eller katastroferammede områder.
Med dokumentasjon og eksempler fra Azure Maps kan du lære hvordan du registrerer disse bildene med passende koordinater og kombinerer dem med andre vektor- eller varmelag for å lage svært rike og spesifikke visualiseringer for hvert scenario.
Varmekart i webanalyse: UX, klikk og rulling
Foruten geografiske kart finnes det en annen veldig populær familie av varmekart: brukeratferdskart på nettstederI stedet for å representere steder i den virkelige verden, viser de hvor brukerne klikker, hvor langt de ruller eller hvordan de beveger musen rundt på siden.
Disse verktøyene er avgjørende for å forbedre brukeropplevelse (UX) og konverteringFordi de forvandler abstrakte målinger til klare bilder. I stedet for å være begrenset til avvisningsfrekvenser og øktvarighet, ser du bokstavelig talt hvilke områder av siden som er «i fyr» av aktivitet og hvilke som forblir kalde.
Hovedbruksområder for varmekart på nettsteder
Blant de vanligste bruksområdene skiller flere nøkkelområder seg ut:
På den ene siden tillater de identifikasjon de mest brukte knappene og handlingsfremmende handlingeneHvert klikk registreres og vises med en farge, slik at elementene som klikkes oftest vises i varmere toner. Dette bidrar til å avgjøre om handlingsfremmende knapper virkelig er det visuelle fokuset, eller om oppmerksomheten tvert imot spres til andre elementer.
De brukes også til måling Hvor langt scroller brukerne?Skrollvarmekart viser hvor stor prosentandel av besøkende som når hver del av siden. Hvis de fleste ikke blar forbi et visst punkt, kan det hende at nøkkelinnholdet er for langt nede, eller siden kan være for lang, et vanlig problem med design på én side.
En annen viktig bruk er UX-problemdeteksjonOfte klikker brukere på bilder eller tekst som ser ut som knapper, men ikke er det. Klikkvarmekart fremhever disse misforståelsene: hvis du ser mye interaksjon på et ikke-interaktivt element, må det sannsynligvis redesignes for å unngå frustrasjon og at brukeren blir forlatt.
I tillegg bidrar varmekart til å Sammenlign oppførselen mellom mobil- og desktopversjonerDe fleste verktøy lar deg filtrere etter enhet, noe som gjør det enkelt å se hvilke elementer som er unødvendige på mobil, hva som blir for skjult, eller hva som fungerer veldig bra på en stor skjerm, men ikke så mye på en telefon.
Til slutt er de utmerkede allierte for A/B-testing av design eller innholdDu kan lansere to versjoner av samme landingsside, og ved å se på varmekartene for klikk, bevegelser og rulling, kan du se hvilken som best retter oppmerksomheten mot konverteringspunktene.
Vanlige typer varmekart i UX
Kommersielle varmekartløsninger for nettsteder tilbyr vanligvis tre grunnleggende typer:
- Vertikale forskyvningskart (rullingskart)Disse målingene viser prosentandelen av besøkende som når hver del av siden. Jo varmere en del er, desto flere brukere har sett den. Dette hjelper med å bestemme hvor handlingsfremmende oppfordringer, skjemaer eller viktig informasjon skal plasseres, og med å identifisere deler som nesten ingen leser.
- Klikk på kartDisse indikerer hvor klikkene er konsentrert på siden. De mest populære områdene peker på elementer som tiltrekker seg mye interesse (på godt og vondt). De er nyttige for å bekrefte at brukerne klikker på de riktige lenkene og for å oppdage «fellesoner» der folk klikker uten å få noen respons.
- BevegelseskartDisse sensorene sporer markørens bevegelse mens brukere leser eller surfer. Selv om musebevegelsen ikke alltid samsvarer perfekt med øyet, gir de ledetråder om lesemønstre og hjelper i beslutningstaking. hvor overskrifter, nøkkelbilder og knapper skal plasseres.
Hvor er det lurt å implementere varmekart på nettstedet ditt?
Det er ikke nødvendig å fylle alt med varmekart: det fornuftige å gjøre er å velge. strategiske sider der en UX- eller konverteringsforbedring vil ha størst effektNoen gode kandidater er:
- La startsidesom vanligvis er førsteinntrykket og knutepunktet hvorfra brukerne distribuerer seg til resten av nettstedet.
- Las landingssider for produkter eller tjenesterspesielt hvis du lanserer et nytt tilbud og ønsker å bekrefte om designet og teksten fungerer.
- Bloggartikler med høy organisk trafikkder en liten endring i interne handlingsfremmende oppfordringer, bannere eller innholdsstruktur kan forbedre ytelsen.
Hvordan lage et varmekart for et nettsted (eksempel med Hotjar)
For å generere varmekart over nettstedet ditt trenger du en verktøy for atferdsanalyse som registrerer brukeraktivitet. Det finnes flere kjente alternativer på markedet, som Hotjar, Clicktale og Crazy Egg, som alle fungerer på en ganske lik måte.
Hvis vi tar Hotjar som et eksempel, er prosessen vanligvis enkel: først registrerer du deg på nettstedet deres og angir domenet du vil analysere. Deretter gir de deg en unikt skript som skal settes inn i overskriften på sidene som du vil overvåke, eller du kan bruke en plugin hvis du jobber med et CMS som WordPress.
Når skriptet eller plugin-modulen er installert, kontroller fra verktøyets dashbord at alt er riktig konfigurert. Derfra begynner Hotjar å samle inn data fra virkelige økter, og etter en stund kan du sjekke resultatene. klikkkart, rullekart, bevegelseskart, øktopptak og merMange av disse plattformene tilbyr gratis prøveperioder på noen få dager, nok til å få en idé om potensialet deres.
Gratis WordPress-plugins for varmekart
Hvis nettstedet ditt er bygget på WordPress og du ønsker noe raskt uten å være avhengig av eksterne tjenester for alt, finnes det gratis varmekart-plugins som er integrert direkte i administrasjonspanelet.
For eksempel lar en plugin som «Heatmap for WordPress» deg lage varmekart på opptil fem sider samtidig i gratisversjonen. Det er vanligvis veldig enkelt å bruke fordi Den startes fra forhåndsvisningen av siden når du er logget innDen lar deg ekskludere IP-adresser (slik at dine egne klikk ikke forurenser dataene), og i tillegg til å vise hotspots, viser den grafer over klikk og visninger per side de siste dagene.
Et annet eksempel er «Aurora Heatmap», med titusenvis av aktive installasjoner. Den tilbyr en gratisversjon som lar deg Se også klikkvarmekartet på mobilen Og den kan brukes på så mange sider du trenger, uten begrensning. Disse løsningene er spesielt interessante for små prosjekter eller blogger som ønsker å forbedre brukeropplevelsen sin uten bryderiet med betalte verktøy fra dag én.
Avsluttende betraktninger
Det er imidlertid viktig å huske på at enhver plugin som legger til sporingsskript... introduserer en viss ytelseskostnadDerfor anbefales det generelt å bruke disse verktøyene intensivt kun i analyseperioder (for eksempel lanseringen av en kampanje) og ikke holde dem unødvendig aktive.
Integrer intelligent tilpassede lag og varmekartI både geospatial analyse og analyse av nettatferd lar den deg gå fra rådata til visuelle mønstre som alle kan forstå med et øyeblikk. Ved å kombinere bruken av API-er som Google Maps eller Azure Maps, GIS-verktøy som QGIS og UX-løsninger som Hotjar eller WordPress-plugins, kan du bygge svært kraftige visualiseringsøkosystemer så lenge du tar hensyn til ytelse, brukskontekst og riktig tolkning av hva fargene viser. Del denne informasjonen slik at andre brukere kan lære om emnet.