A Simple Guide to OpenLayers in Angular

Paul Harwood
Runic Software
Published in
4 min readMay 31, 2020

--

How to use the powerful mapping library in Angular

Photo by Kelsey Knight on Unsplash

Having been using Leaflet for mapping in Angular and writing about how to do it, I have now been working on some mapping projects using OpenLayers.

Why OpenLayers

Having written a whole series of articles about using Leaflet in Angular — i.e. see this …

… Why change to OpenLayers?

Leaflet is a great library and it is very easy to quickstart simple projects. It needs very little set up and has a large library of controls and extensions. However, if you want to go beyond the basics, particularly in terms of complicated projection manipulation or wanting to have real GIS symbology on the layers (i.e. programmatic control of the shape, size and colour of features) as opposed to simple markers, Leaflet runs out of steam quite fast. It is a bit like Google Maps in that regard.

OpenLayers (OL) is, to my mind, much more powerful but tends to have a higher cost to learn and to start a project because of that. OL also expects you to…

--

--

Paul Harwood
Runic Software

Paul is a long time veteran of the tech industries — with 30 years in the trenches including stints with Nokia and Google as well as startups QR8 and trackbash.