Questions tagged [ngx-leaflet]

Leaflet components for Angular.io published to npm under @asymmetrik/ngx-leaflet

149 questions
16
votes
2 answers

'L' refer to a UMD global - compilation error

I am using in my project the plugin ngx-leaflet, and angular-cli. I am trying to use leaflet as described in the doc, for example : The problem is when I'm trying to compile I got the following error : Compiled with : ng serve --aot Context here…
Orelsanpls
  • 22,456
  • 6
  • 42
  • 69
15
votes
3 answers

Angular Universal: navigator is not defined

I followed official angular-cli tutorial to integrate angular-universal to my existing angular-cli app. I am able to do SSR for my angular-cli app. But when I try to integrate ngx-leaflet, I am getting following error: ReferenceError: navigator is…
11
votes
2 answers

Abstract away leaflet directive in custom directive

I'm currently working on an Angular 6 application that uses ngx-leaflet for using leaflet. We want to be able to create a base component that can be customized by adding directives to it. Basically the same pattern that is used when using draw…
Saab
  • 981
  • 3
  • 11
  • 34
10
votes
1 answer

Material Dialog gets stuck when called onClick of leaflet Marker

I have a project where i have a map (using ngx-leaflet ). On click on a marker i want to show a Dialog from Angular Material. The Dialog opens but when i click on the close button, it reopens again and then closes. What i tried: Delaying the dialog…
Joniras
  • 1,258
  • 10
  • 32
8
votes
3 answers

Coordinates on clickevent

I'm new to @asymmetrik/ngx-leaflet and Angular in general, so this is maybe just a newbie-issue... I have an Angular.io (v5) project using the @asymmetrik/ngx-leaflet-tutorial-ngcli Now I would like to get the coordinates of the point I clicked on…
CaptainInler
  • 157
  • 1
  • 9
7
votes
1 answer

Leaflet - import Geojson - Angular 6

i try to import GeoJson file to leaflet in angular's app 6. With this solution my geojson is drawn in leafletmap but i have this error and i can't build my app. Someone know one solution ? ERROR TS2345 Argument of type '{"type":…
al NTM
  • 247
  • 5
  • 15
5
votes
1 answer

ngx-leaflet-draw: Importing module which does not have a ɵmod property

Importing LeafletDrawModule which does not have a ɵmod property I am seeing this error during my unit testing(jest). The code works fine when I run the ng application. Leaflet draw function works perfectly. Angular: 11 @asymmetrik/ngx-leaflet:…
5
votes
5 answers

Can't bind to 'leafletOptions' since it isn't a known property of 'div'

I know this is an issue that comes up here often and is fixed by fixing import statements. I currently have import { LeafletModule } from 'node_modules/@asymmetrik/ngx-leaflet'; import * as L from 'leaflet'; import { } from '@types/leaflet'; I am…
wvarner
  • 116
  • 2
  • 7
4
votes
1 answer

Adjust Leaflet popup to table size in angular leaflet

I have a popup for a layer on the Leaflet map and a popup appears when you click on a point on the map. The popup should display a table with the data for that specific layer. However, the popup does not adjust to the table size: But when I do get…
fairlyMinty
  • 413
  • 8
  • 22
4
votes
3 answers

Integrate EasyButton, Geoman with ngx-leaflet

I am using raw leaflet.js in my Angular Application which depends on some leaflet plugins like EasyButton, Geoman, Distortable Image. ngx-leaflet looks cool and simple. So I've decided to migrate to ngx-leaflet. But I am sure if it is possible to…
Arul Rozario
  • 679
  • 1
  • 9
  • 20
4
votes
1 answer

ngx-bootstrap tabs don't work in modal opened through leaflet

Relevant code : https://stackblitz.com/edit/angular-ngx-leaflet-tests-kz7kc7 When you click on a marker, modal opens but tabs inside don't work. There is some problem with angular change detection. It works if I manually detect changes. How can I…
Krk Črn
  • 134
  • 2
  • 8
4
votes
3 answers

Leaflet Draw on rectangle draw it throws error

I'm using leaflet + leaflet-draw + @ngx-leaflet + @ngx-leaflet-draw in an Angular application. I've tried everything, versions change, importing the modules .forRoot() and not, adding the js files in my angular.json file, remove node_modules,…
Caius
  • 2,084
  • 6
  • 31
  • 47
4
votes
1 answer

ngx-leaflet: How to add a custom control?

I have tried for a while now to implement this leaflet tutorial using the ngx-leaflet. There is absolutely no clear documentation on how to implement a custom control or legend while following along with the tutorial. var info =…
Dylan
  • 1,919
  • 3
  • 27
  • 51
4
votes
1 answer

Leaflet marker icon url compiled wrong while running ng build --prod

For some reason the Leaflet marker icon url compiled wrong while running ng build --prod instead when running ng build the Leaflet marker icon url is fine. My environment: Angular CLI: 7.0.5 Node: 11.2.0 OS: linux x64 Angular: 7.0.3 ... animations,…
b00r00x0
  • 853
  • 1
  • 15
  • 21
4
votes
1 answer

Add BeautifyMarker plugin to ngx-leaflet project

I am currently unable to integrate the BeautifyMarker plugin with the ngx-leaflet Angular 2 package. I have followed the install instructions for BeautifyMarker alongside the ngx-leaflet plugin instructions with no luck. I used npm install to grab…
Lauren
  • 1,035
  • 1
  • 14
  • 32
1
2 3
9 10