womap

Map based on leaflet and mapbox vector tiles. Icons are displayed using PixiJS. The service is provided by WO.

Usage no npm install needed!

<script type="module">
  import womap from 'https://cdn.skypack.dev/womap';
</script>

README

WoMap

Map based on leaflet and mapbox vector tiles. Icons are displayed using PixiJS. The service is provided by WO.

How to use

  • Run npm i womap

  • Add leaflet styles angular.json (more info)

 {
  ...
  "styles": [
    "styles.css",
    "./node_modules/leaflet/dist/leaflet.css"
  ],
  ...
}
  • Add assets in your angular.json
{
  ...
  "assets": [
    "src/assets",
    {
      "glob": "**/*",
      "input": "./node_modules/womap/assets",
      "output": "assets/"
    }
  ],
  ...
}
  • Add mapbox styles to your index.html
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.css" rel="stylesheet"/>
  • Use the lib-womap your component
<div>
  <lib-womap accessToken="05f60c8d-5427-42fb-8ee5-01adbed78d42"></lib-womap>
</div>
  • For socket.io to work, add the next line to polyfills.ts file in your src directory.

(window as any).global = window