At the weekend, I found myself starting another little side project that needed a map. And, predictably, I chose to use a HERE map.

In my day job, I use a lot of Vue but I do tend to prefer web components where possible, wrapping them in Vue only where necessary. This, then, is the natural outcome:

Now I can embed HERE maps with a single web component.

<here-map api-key="1234-54321"
  latitude="52.5"
  longitude="13.4"
  zoom="12"
></here-map>

Or include markers directly:

<here-map
  api-key="1234-54321"
  latitude="52.5"
  longitude="13.4"
  zoom="12">

  <here-map-marker latitude="52.5" longitude="13.4" />

  <here-map-marker
    latitude="52.501"
    longitude="13.405"
    icon="https://cdn3.iconfinder.com/data/icons/tourism/eiffel200.png"
  />
</here-map>

Have a look at the example.