HIER Verwarmt

Submitted by
SWIS B.V.
The Case
Category
Non-profit
Short introduction
Stichting HIER, the Dutch climate bureau and SWIS have realized www.hierverwarmt.nl together. HIER Verwarmt is the online platform with everything there is to know about living without natural gas.
Launch date
Background
In 2050 the Netherlands need to be free of using natural gas as a resource. This is what the Dutch government decided in 2016. This is a huge commutation for the Netherlands in which 95% of all households are connected to the natural gas network.

Stichting HIER has an important role in this transition. It is their job to make sure the Netherlands are technically prepared, but also mentally. The website offers information and tooling for municipalities an corporations to activate citizens in promising neighbourhoods to become free of natural gas.
Objectives
• The website must be the number 1 website in the Netherlands about living without natural gas.
• The website must be consulted by residents and it must provide them with useful information about their natural gas situation.
The main goal for the website in the first three years is to create awareness. One of the tools to help creating awareness is the personal zipcode checker. With this tool a resident is able to see what kind of plans their municipality has made to become free of natural gas. After three years the website will transform more and more into a knowledge hub, containing all knowledge and information about the matter.
Results
The website is visited about 2200 times a week. Conversion is measured by the amount of visitors that use the zipcode checker. Now 34% of the visitors use the zipcode checker.
Other visitors look at the full map of the Netherlands or they go straight to the information pages about alternatives for heating your home without natural gas.
Technical challenges
The big challenge with HIER Verwarmt is the zipcode checker, which makes it possible to see what kind of plans your municipality has to get you neighbourhood of natural gas. When a visitor enters his zipcode we have a look of the available date within the municipality borders.
It is possible that one zipcodes covers more than one neighbourhood. The challenge is to get several datasources (overlapping neighbourhood borders, examples of projects, natural gas free zones and heatplans) and create a user friendly page.

The functionalities on the page are:
• Getting an announcement that there are plans to make your neighbourhood free of natural gas
• The possibility to subscribe to your neighbourhood with your e-mail. Then you will receive an update in your mailbox anytime a municipal employee makes a change in the local plans.
• A visitor is able to see a streetview image of his neighbourhood via the Google Maps API
• There is an interactive online map of your neighbourhood that show natural gas free zones, existing plans and plans that are in preparation and markers with examples of other projects that are going on.
• There’s information about alternative ways to heat your home. Also the visitor can see statistics about the use of natural gas within the municipality.

To build this page we had to take into account several technical points of attention:
• Based upon the entered zipcode in the zipcode checker, we use the geocoder module to get the lat-long coordinates (https://www.drupal.org/project/geocoder).
This is done with a custom developed provider who is connected with the API of nationaalregister.nl
• On a municipal level we look at the available heatplans. Geo information about this heatplans is stored via the geofieldmodule. With this module it is only possible to search within multi polygons. For this we developed our own implementation:
https://www.drupal.org/project/geofield
• All map layers are custom developed in collaboration with wepmapper.net.
• All map layers are shown with the leafletmodule. https://www.drupal.org/project/leaflet
Challenges in (combination of) modules
As described before, the zipcode checker makes it possible to search for heatplans in your neighbourhood. It also shows metadata like the usage of natural gas in your municipality.
We have used the following modules:
Geocoding: https://www.drupal.org/project/geocoder
Saving Geo data: https://www.drupal.org/project/geofield

Example of these modules: https://www.hierverwarmt.nl/wageningen
Contribution form the project to the Drupal-community
https://www.drupal.org/project/bem
- Prevent the need of overriding templates as much as possible.
- Provide BEM classes that are (hard)coded or refer to configuration (machine names), but never refer to content.
- Combine Drupal specific concepts into sensible BEM components (like the fields of a node when rendered in a specific view mode. For example .node-article-teaser and .node-article-teaser__image.

https://www.drupal.org/node/2820738
Problem: Need a way to set the bounds option for layers.
Solution: layer.options.bounds option gets converted to a L.latLngBounds object in create_layer.

https://www.drupal.org/node/2817257
Feature for adding pop-up options on online map.

https://www.drupal.org/node/2810805
Patch for base layers controls.

https://www.drupal.org/node/2743379
Check permission before showing Clone operation.
Name client
Stichting HIER Klimaatbureau
What does the client think about the project?
We are very content with www.hierverwarmt.nl. It looks clean and fresh and is easy to use. Because the transition from natural gas to renewable sources of heat has only just begun, we were in need of a very flexible website that develops along with the needs of our target audience. We hope to keep optimizing this website for the next few years to make sure we reach our goals of informing people about the transition, convincing them of the necessity and persuading them to act accordingly.

Wat probably expresses our satisfaction best, is that after Hierverwarmt.nl we choose to work with SWIS again for two other projects.
Screenshot