100DaysOfCode

Solutions: Day 36-40 #100DaysOfCode

By Sayna Parsi | 19 May 2020

Try HERE Maps

Create a free API key to build location-aware apps and services.

Get Started

You have made it to the Week 8 of #100DaysOfCode with HERE! If you are new to this challenge, take a look at this blog post which will tell you everything about #100DaysOfCode with HERE. In this blog post, I will cover solutions for days 36 through 40 on the topic of Geofencing. If you have missed the previous solutions you can find them in our previous blog posts, in video format, or you can find them on our github repo.

Let's begin!

Day 36/100

For day 36, we are creating a WKT file to mark a location of interest for our Geofence. A WKT file is a human readable representation for spatial objects like points, lines, or enclosed areas on a map. We have a blog post that goes in depth about how you can create a WKT file. For example, you might have a physical store and you’d like to send your customers a notification when they are nearby to tell them about your latest promotions. For this example, I will create an area around SpaceNeedle. When you create your WKT file, you can add a column to specify the name of your spatial object and another column to specify the WKT representation. Make sure that your columns are tab delimited.

NAME    WKT
SPACENEEDLE    POLYGON((-122.34955611506788 47.620666853267224,-122.34930398742048 47.6208006380942,-122.34902235547392 47.62069758764966,-122.34904917756407 47.62047340703363,-122.34933080951063 47.62034323720253,-122.34958561936705 47.62044990417142,-122.34955611506788 47.620666853267224))

Day 37/100

When it comes to creating layers, you have a few options for doing so. You can create a layer using the layers dashboard, you can zip your WKT file and upload it through a curl command, or via a REST call. Regardless of how you choose to upload your layer, when you have successfully uploaded your layer, you can go to the layers dashboard to verify your submission:

Screen Shot 2020-05-04 at 3.27.02 PM

Day 38/100

As you make geofencing applications, you want to be able to interact with your layers and the first step is to retrieve the layers that you have uploaded! You can retrieve the layers you uploaded via a REST call. You will need to provide your API Key and you’ll get a list of layers as a response. If you have uploaded one layer so far, you’ll get one item in your list. The information you get back will refer to the name or ID of the layer you created.


  getLayers() {
    let fleetURL = "https://fleet.ls.hereapi.com/2/layers/list.json"
    return axios({
      method: 'get',
      url: fleetURL,
      params: {
        apiKey: config.apiKey
      }
    })
    .then(response => {
      return response.data.layers
    })
    .catch(error => {
      return Promise.reject(error)
    })
  }

Day 39/100

Alright, so here’s the exciting part! Now we are creating a function that takes a layer (the one we uploaded) a point and returns whether our point falls in our perimeter or not. There is a proximity parameter that takes a string in the format of “lat,long”. We can pass our position information to the proximity parameter.


  fenceRequest(layerIds, position) {
    return new Promise((resolve, reject) => {
      this.geofencing.request(
        H.service.extension.geofencing.Service.EntryPoint.SEARCH_PROXIMITY,
        {
          'layer_ids': layerIds,
          'proximity': position.lat + "," + position.lng,
          'key_attributes': ['NAME']
        },
        result => {
          resolve(result)
        },
        error => {
          reject(error)
        }
      )
    })
  }

Day 40/100

The above function tells us whether or not a given point is inside our layer. But what if you want to be notified when the point is within a certain distance from your layer? For example, imagine if you have a physical store and your customer happens to be nearby and you want to let them know about the sales promotions that you have today. In this case, if you set the distance to 100 meters, your customer can get notifications about your promotions when they are within 100 meters of your store.


  fenceRequest(layerIds, position) {
    return new Promise((resolve, reject) => {
      this.geofencing.request(
        H.service.extension.geofencing.Service.EntryPoint.SEARCH_PROXIMITY,
        {
          'layer_ids': layerIds,
          'proximity': position.lat + "," + position.lng + "," + 100,
          'key_attributes': ['NAME']
        },
        result => {
          resolve(result)
        },
        error => {
          reject(error)
        }
      )
    })
  }

We hope that you have enjoyed this challenge so far! Follow us on Twitter to get updates about future weeks of #100DaysOfCode. If you want to watch the video version of these solutions, take a look at our playlist for #100DaysOfCode on YouTube.

If you are looking for other hands on tutorials, I'd recommend reading How to Find Geo-Coordinates(GPS) using the Geocoding and Search API. If you've been with us for a while and you are looking into learning about the improvements to our services you can refer to April 2020 Release Highlights.
Happy coding!