Dark mode standaard beschikbaar in ANP LocalFocus

Ondersteunt jouw website of app een donkere modus? Goed nieuws! Vanaf nu heeft ANP LocalFocus standaard dark mode-opties. Zo passen kaarten en grafieken ook in donkere modus perfect binnen jouw website of app.

Er zijn drie manieren dark mode te activeren voor LocalFocus-visualisaties. Je kan methoden mixen, zodat het bijvoorbeeld zowel op jouw website als in apps goed werkt. Bij de tweede en derde methode heb je wellicht hulp nodig van developers. Ons advies nodig? Mail dan naar servicedesk@anp.nl.

1. Automatisch activeren

Je kunt dark mode automatisch activeren. ANP LocalFocus kijkt dan naar de systeeminstelling van de computer of telefoon. Bij veel apparaten kan je als gebruiker namelijk instellen of je lichte of donkere modus wilt gebruiken. 

Wil je deze methode gebruiken? Mail dan servicedesk@anp.nl en wij activeren deze methode voor alle nieuwe visualisaties die je gaat publiceren.

Werkt goed: als jouw website ook automatisch detecteert of donkere modus op een systeem actief is, doordat jouw site bijvoorbeeld een CSS stijl voor dark modes heeft.

Werkt wellicht niet goed: in apps, of op websites waarbij een eigen implementatie is ingericht voor het in- en uitschakelen van een donkere modus.

2. Semi-automatisch activeren

Soms wil je per website of app controle over wanneer ANP LocalFocus automatisch dark mode probeert te activeren (zie methode 1). Je wilt dan  zelf bepalen of dark mode wordt geactiveerd wanneer een gebruiker donkere modus heeft ingesteld in de systeeminstellingen.

Wil je deze methode gebruiken? Voeg dan ?darkmode toe achter urls naar kaarten en grafieken. Urls beginnen met https://localfocuswidgets.net/.

Voorbeeld grafiek: https://localfocuswidgets.net/65cca4e3b7c67?darkmode

Voorbeeld kaart: https://localfocuswidgets.net/65cca83b726f2?darkmode

Werkt het niet direct? Mail dan naar servicedesk@anp.nl.

Werkt goed: als een van jouw websites een CSS-stijl heeft voor dark mode, maar een andere niet. Je kan dan dezelfde visualisaties gebruiken, maar op de ene site de semi-automatische detectie aanzetten en op de andere niet.

Werkt wellicht niet goed: in apps, of op websites waarbij een eigen implementatie is gebouwd voor het in- en uitschakelen van een dark mode.

3. Handmatig activeren

Soms wil je volledige controle over wanneer donkere modus wordt geactiveerd. Dat kan!

Wil je deze methode gebruiken? Voeg dan ?darkmodeforce toe achter urls naar kaarten en grafieken. Donkere modus wordt dan altijd geactiveerd, ongeacht wat gebruikers hebben ingesteld in hun systeeminstellingen. Urls beginnen met https://localfocuswidgets.net/.

Voorbeeld grafiek: https://localfocuswidgets.net/65cca4e3b7c67?darkmodeforce

Voorbeeld kaart: https://localfocuswidgets.net/65cca83b726f2?darkmodeforce

Werkt het niet direct? Mail dan naar servicedesk@anp.nl.

Werkt goed: in apps, of op websites waarbij een eigen implementatie is gebouwd voor het in- en uitschakelen van een dark mode.

Onze oude kaartserver is met pensioen en een quiz

De kaarten die je maakt met LocalFocus hebben standaard een ondergrond (ofwel basemap). Deze wordt gegenereerd door onze eigen kaartserver. Dat was een flink bakbeest en het was hoog tijd voor een upgrade.

We hebben de oude server met pensioen gestuurd en een compleet nieuwe server opgezet. We maken weer gebruik van de laatste geografische data van Openstreetmap, zodat ook de nieuwste wegen, wijken, en bruggen op de kaart te zien zijn.

Ook is de nieuwe server sneller en efficiënter, waardoor we meer details kunnen laten zien op de kaarten. Want dit was een probleem: onze oude server werd traag door gedetailleerde kaarten, waardoor wij kozen om veel kleinere objecten niet te tonen, zoals kleine waterplassen, beekjes, wandelpaden en tunnels.  Nu onze ict-opstelling verbeterd is zul je ook deze features zien op de ondergrond van LocalFocus kaarten.

Je hier zelf kaarten met LocalFocus maken

En nu een kleine quiz… bij welke vier Nederlandse plaatsen horen deze vier kaarten (klik om te vergroten)? Antwoorden kan hier

Zo maak je een live-gekoppelde grafiek in zeven stappen

Hoera! Met onze nieuwe visualisatietool maak je eenvoudig live-gekoppelde grafieken en cirkeldiagrammen. Zo kun je een grafiek op je website updaten met nieuwe data zonder dat je deze telkens moet vervangen. Dit werkt als volgt: je koppelt een Google-spreadsheet aan je zelfgemaakte grafiek. Alle cijfers die jij in deze spreadsheet aanvult, worden automatisch toegevoegd aan de visualisatie. 

Het team van LocalFocus werkt al een paar maanden met deze functie en nu kan jij er ook zelf mee aan de slag. In zeven stappen leg ik je uit hoe je dit doet.

Heb je nog geen account? Registreer je hier

Stap #1 Start een project

Om te beginnen moet je een project starten in de nieuwe grafiekmodule. Daarvoor hebben we een (tijdelijke) geheime ingang gebouwd. Houd de shifttoets ingedrukt terwijl je op ‘Visualisatie’ klikt om een nieuw datavisualisatie te maken.

Visualisatie

Als dit goed is gegaan verschijnt onderstaand scherm.

Stap #2 Bereid je data voor

Zorg ervoor dat je data netjes in een Google-spreadsheet staat. Ik heb zelf een simpel voorbeeld met appels en peren gemaakt. Wil je deze demo-dataset ook gebruiken om mee te oefenen? Kopieer dan deze tabel.

Appels en peren

 

Stap #3 Publiceer je Google-spreadheet online

Staat alles in je Google-spreadsheet goed? Dan kun je deze publiceren. Klik dan op ‘File’/’Bestand’ > ‘Publish to the web’/’Publiceer op internet’ > en klik nogmaals op ‘Publish’/’Publiceren’ in het venster dat verschijnt.

Stap #4 Kopieer de link

Kopieer de link uit de Google-spreadsheet naar het invulvakje in de visualisatiemodule (gemarkeerd in onderstaande afbeelding). De online tabel verschijnt gelijk in de tabelweergave van de visualisatiemodule van LocalFocus. Je dataset is nu gekoppeld! 💪

Stap #5 Label je dimensies

De visualisatietool herkent zelf welke ‘dimensies’ in jouw tabel voorkomen. Daar zijn er drie van: periodes (bv. dagen of jaartallen), categorieën (bv. appels en peren) en eenheden (bv. percentages en absolute aantallen). Controleer dit door met je muis over de tabel te bewegen.

Stap #6 Check je getalnotaties

Welke regio-instellingen gebruik je? Zijn je decimalen gescheiden door komma’s of punten? Selecteer de juiste optie.

Stap #7 Vormgeving

Klik op ‘Verkennen’ en kies de visualisatievorm die jij wilt. Vervolgens kun je naar de laatste tab ‘Creëren’. Geef je eenheid (of meerdere eenheden) een nette naam onder ‘Assen en tooltips’.

Je grafiek is klaar om gepubliceerd te worden! Klik hier om mijn resultaat met de appels-en-perendata te bekijken.

Gegevens die je nu aanvult in de Google-spreadsheet worden automatisch geüpdatet in de gepubliceerde visual. Denk bijvoorbeeld aan het toevoegen van rijen of kolommen, of het aanpassen van cijfers. Het is niet meer nodig om een nieuwe embed-code toe te voegen aan de website wanneer je gegevens wijzigt.

Maak je eerste live-grafiek


Heb je vragen, opmerkingen of hulp nodig bij het maken van je eigen live-gekoppelde grafiek? Stuur dan een berichtje naar jelle@localfocus.nl.

 

Voorbeeldcase LocalFocus ‘Vraag en Antwoord’: bierbrouwerijen

Momenteel werken we hard aan de LocalFocus ‘Vraag en Antwoord’. Met deze nieuwe feature kun je twee dingen doen. Allereerst kun je makkelijk lijsten doorzoeken en filteren. Dit is handig als er bijvoorbeeld verkiezingen zijn en je wil snel alle vrouwen op de kieslijsten bekijken. Met de tweede functie stel je een aantal ‘vragen’ aan de lezer, die vervolgens op basis van een dataset ‘antwoord’ krijgt op zijn vraag. Hier onder vind je een voorbeeld van de laatste optie: waar kun je in jouw regio een (speciaal)biertje scoren bij een brouwerij? Doorloop de stappen om daar achter te komen! Bekijk hier hoe Yordi de onderstaande tool maakte.



Dit is een beta-versie. De LocalFocus ‘Vraag en Antwoord’ is momenteel nog in ontwikkeling. Heb je op basis van deze versie opmerkingen of tips? Stuur dan een mailtje naar erik@localfocus.nl

Nieuw in LocalFocus: staaf- en lijngrafieken met dubbele Y-as

We gaan het nieuwe jaar fris in met een nieuwe frisse visualisatievorm! Vanaf nu kun je eenvoudig een lijngrafiek met twee verticale assen maken of een lijn- en staafgrafiek combineren. Deze vorm gebruik je als je twee variabelen met verschillende eenheden (een eenheid is het ‘soort’ cijfer, bijvoorbeeld een percentage, aantal of bedrag) wilt vergelijken of om een verband aan te tonen. Denk aan de jaar-op-jaar prijsstijging van chocola, snoep of ijs en de ontwikkeling ten opzichte van het beginpunt januari 2015 (1) of het aantal melkveebedrijven ten opzichte van het gemiddeld aantal gehouden melkkoeien (2).

Hoe maak je een grafiek met dubbele Y-as?

Voor het maken van een grafiek met een dubbele Y-as heb je een tabel met twee variabelen nodig. Een voorbeeld: we willen uitzoeken hoe het zit met de schaalvergroting van landbouwbedrijven. In onderstaande tabel vind je het aantal bedrijven dat melkvee houdt en het gemiddeld aantal gehouden melkkoeien per landbouwbedrijf

Deze tabel voeg je toe aan het LocalFocus-platform zoals je gewend bent (ben je nieuw met LocalFocus of heb je een opfrisser nodig? Volg dan deze tutorial), waarbij je aangeeft dat het aantal bedrijven en het gemiddeld aantal melkkoeien de eenheden zijn. Vervolgens zet je beide eenheden aan en selecteer je een lijngrafiek.

Omdat je normaal gesproken twee eenheden niet direct met elkaar kunt vergelijken, het zijn immers verschillende ‘soorten’ cijfers, geeft het platform je een automatische waarschuwing (‘Waarschijnlijk kun je de eenheden in deze visualisatie niet met elkaar vergelijken’). Als je van plan bent om een grafiek met dubbele Y-as te maken kun je deze waarschuwing echter negeren.

Ga vervolgens naar het tabje ‘Creëren’ en klik in de grafiek op het legendablokje van de variabel die in de tweede Y-as moet komen te staan, in dit geval het gemiddeld aantal gehouden melkkoeien per landbouwbedrijf. Vink ‘Plaatsen in rechter as aan’ en voilà: een grafiek met dubbele Y-as!

Het platform maakt automatisch een inschatting van de benodigde schaalverdeling voor je grafiek. Mocht je deze alsnog aan willen passen, klik dan wederom in de grafiek op een van cijfers op de verticale as die je aan wilt passen. Vervolgens kun je zelf een minimale en maximale waarde aangeven.

Tot slot is het nog mogelijk om een staaf- en lijngrafiek te combineren. Om dit te doen selecteer je binnen het tabje “Verkennen” de kolomgrafiek (Deze: 📊), selecteer je de variabel die als lijngrafiek weergegeven moet worden (in dit geval gemiddeld aantal gehouden melkkoeien per landbouwbedrijf) en vink je ‘Teken als lijn’ aan.

Hoewel een grafiek met dubbele Y-as in sommige gevallen heel doeltreffend kan zijn, is het voor sommige lezers een complexe en lastig af te lezen grafiekvorm. Vraag jezelf dus goed af of deze vorm geschikt is voor je data. Bij twijfel, kies voor een Storyboard of een grafiek met een interactieve dropdown. Heb je vragen over deze visualisatievorm? Stuur dan een mailtje naar yordi@localfocus.nl

Nieuw in LocalFocus: de scatterplot

Een scatterplot is een enorm veelzijdige manier om data te visualiseren – hoewel het misschien niet de meeste bekende visualisatie is. Met de scatterplot, of puntenwolk, kun je namelijk de relatie tussen twee variabelen tonen: iets waar veel andere visualisatievormen een stuk meer moeite mee hebben. Een van de bekendere voorbeelden van de scatterplot zit in deze lezing van wijlen Hans Rosling, waarin hij de levensverwachting afzet tegen de welvaart.

Het is nu ook mogelijk om scatterplots met LocalFocus te maken. Het voorbeeld in bovenstaande video kan bijvoorbeeld ook gemakkelijk worden gemaakt in het dataplatform.

Voor het maken van een scatterplot heb je een tabel nodig met ten minste twee variabelen voor op de assen. In bovenstaand voorbeeld zijn dat de levensverwachting en het BBP per hoofd van de bevolking. De punten worden bepaald door andere dimensie, bijvoorbeeld de landen van de wereld. Mogelijkheden die je in ons platform bij andere visualisaties hebt, werken ook voor de scatterplot:

  • Er kunnen interactieve elementen aan de visualisatie worden toegevoegd. Een timeslider maakt het bijvoorbeeld mogelijk om de patronen door de tijd heen te bekijken.
  • Er kan extra nadruk worden gegeven aan belangrijke punten met behulp kleur en directe labels.

Tot slot is het ook mogelijk om een zogeheten connected scatterplot te maken. Hierbij werden we geïnspireerd door dit voorbeeld uit het boek The Functional Art van Alberto Cairo. De richting van de lijn laat zien hoe Brazilië zich tussen 1981 en 2010 heeft ontwikkeld. Wanneer de lijn zich bijvoorbeeld naar rechtsboven beweegt, laat dit zien dat de welvaart toeneemt, maar wel steeds ongelijker verdeeld is.

Lees meer over connected scatterplots in deze blog van Alberto Cairo of ga er zelf mee aan de slag in ons dataplatform om een productie zoals deze te maken:

Vragen of opmerkingen over de scatterplot? Mail naar jelle@localfocus.nl!

Hoe een robot ons meer tijd geeft voor journalistiek

Begin 2017 hadden wij overleg. We waren veel tijd kwijt met simpel terugkerend werk. Voorbeeld: mijn collega Yordi houdt o.a. de maandelijkse werkloosheidcijfers bij. Dus opletten of er nieuwe cijfers zijn, dan naar de site van de databron, selecties maken, data downloaden, bewerken, uploaden in LocalFocus, stukje tikken, notificatie-mailt sturen. Elke maand dezelfde handelingen. En dat is zonde. Want het gaat ten koste van echt journalistiek werk.

LocalFocus Connect verstuurt een tweetje met grafiek

Daarom zijn we een project gestart: LocalFocus Connect. Dit is een robot die honderden datasets van open data-bronnen zoals CBS en Kadaster bijhoudt. Wanneer een dataset wordt bijgewerkt voert de robot taken uit. Bijvoorbeeld het uitrekenen van relatieve cijfers, een tweet met grafiek sturen via @lfbetabot of de dataset in LocalFocus plaatsen. Lijkt een beetje op If This Then That, maar dan voor open data.

Voordelen van een data-robot:

  • Automatiseer simpele taken tot de max! Verspil geen tijd met terugkerende werk. Als jij elke dag/week/maand een stukje en grafiekje maakt over een bepaald onderwerp, dan kan je dit voor een deel automatiseren.
  • Robots slapen niet. Als een dataset wordt bijwerkt, weet jij het als eerste.
  • Je kan honderden (misschien duizenden?) datasets tegelijk in de gaten houden.


Hoe redacteuren ermee werken

LocalFocus Connect is een Python-programma met een command-line-interface. Iedereen bij LocalFocus kan ermee werken. Dit is wat redacteuren doen:

  1. Start LocalFocus Connect en kies welke databron en dataset je wilt bijhouden
  2. Vertel welke selecties je wilt bijhouden binnen de deze dataset
  3. Vertel wat er moet gebeuren wanneer de datasets is bijgewerkt
  4. Simuleer de taak zodat je weet dat alles goed werkt

En voila, LocalFocus Connect zal deze taak 24 uur per dag bijhouden en de opdrachten uitvoeren wanneer dat nodig is. Op bot.localfocus.nl zie je welke taken LocalFocus-redacteuren nu hebben draaien.

Modules

LocalFocus Connect bestaat uit een kern en daaromheen verschillende modules. Voor de invoer van data zijn er op dit moment de modules CBS, Eurostat, Kadaster. Voor de uitvoer zijn er LocalFocus, Twitter en Slack. Alle invoer bestaat op dit moment uit open data.We zullen de komende tijd meer modules schrijven voor andere bekende open data-bronnen. We gaan ook onderzoeken hoe we een module kunnen opzetten die geautomatiseerd een tekst schrijft aan de hand van de nieuwe dataset.

Wil je hierover praten? Toffe ideeën? Neem dan contact met ons op via jelle@localfocus.nl



Nieuw inlogscherm voor LocalFocus

Het dataplatform van LocalFocus krijgt een nieuw inlogscherm. Hiervoor kon je alleen inloggen met een Google-account. Vanaf nu kan je je ook aanmelden met een mailadres en LocalFocus-wachtwoord. Wil je hiervan gebruikmaken? Stel dan eerst eenmalig dit wachtwoord in. Dat kan in het platform onder het menukopje Gebruiker.

In de week van 29 augustus zal dit nieuwe inlogscherm beschikbaar zijn.

 

Nieuw inlogscherm LocalFocus

 

Zonder in te loggen aan de slag met LocalFocus? Dat kan!

Een suffe spreadsheet omtoveren in een vette visualisatie? Dat is vanaf nu nog makkelijker! Ga zonder in te loggen direct aan de slag met de gratis versie van het platform: de LocalFocus playground. Speel met één van de voorbeelddatasets of voeg je eigen datasets toe. Inloggen (met een Google-account) doe je nu pas zodra je een graphic wilt embedden. Wel zo handig! Daarnaast kun je kiezen voor een lijst-of tegelweergave van je toegevoegde datasets, voor nog meer overzicht.

Zelf aan de slag? Klik dan hier.

Nieuw met LocalFocus? We hebben vast een aantal Nederlandse datasets klaargezet in het platform over onder meer autobranden, singles en boetes voor fietsen zonder licht (klik op een link om direct naar het onderwerp in LocalFocus te gaan). Daarnaast worden automatisch tientallen CBS-datasets dagelijks bijgewerkt. Denk aan cijfers over het aantal asielzoekers in Nederland, benzineprijzen, werkloosheid en inflatie. Deze datasets vind je achter de tab “CBS datasets” in het menu aan de linkerkant van het scherm.

Enkele CBS-datasets in de LocalFocus Playground

 

Update LocalFocus: nieuwe functies!

We hebben een update doorgevoerd met nieuwe functies!

Liggende staafgrafiek groeperen of stapelen

We kregen van veel gebruikers deze wens door en vanaf nu kan het! Liggende staafgrafieken groeperen of stapelen.

 

 

Klik en bewerk

Als je in het tabje Creëren bent, kan je elementen van de visualisatie direct bewerken. Op dit moment zijn nog niet alle elementen aanklikbaar, maar we zullen dit steeds verder uitbreiden.