我在我的项目中使用了插件ngx-leaflet和angular-cli.

我正在尝试使用文档中描述的传单,例如:

问题是当我尝试编译时出现以下错误:

编译:

ng serve --aot

上下文:

我确实尝试L使用以下方式导入:

import { LeafletModule } from '@asymmetrik/ngx-leaflet';

但我在文档和github中找不到任何东西.

我确实删除了模块atm进行编译,但我需要一个解决方法.

这是package.json我使用的:

这是我的组件内部的代码,用户'L':

@Component({
  selector: 'app-map-screens-element',
  templateUrl: './map-screens-element.component.html',
  styleUrls: [
    './map-screens-element.component.scss',
  ],
})

export class MapScreensComponent implements OnInit {
  /**
   * setting map options
   */
  public $mapOptions = {
    // we use the layer openstreetmap
    layers: [
      L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'),
    ],
    zoom: 15,
    center: L.latLng([48.866667, 2.333333]),
  };
}

这里将模块导入我的项目:

import { LeafletModule } from …

我目前正在研究使用ngx-leaflet来使用传单的Angular 6应用程序.我们希望能够创建一个可以通过向其添加指令来自定义的基本组件.基本上与使用leafletDraw使用绘图功能时使用的模式相同.但是这些指令应该比传单和leafletDraw指令更抽象.

目前我们最终得到了我们的"基础组件"中使用的以下模板

<div class="map" leaflet [leafletOptions]="options" [leafletLayers]="layers" [leafletOptions]="options" leafletDraw [leafletDrawOptions]="drawOptions" poiSelection [poiSelectionOptions]="selectionOptions"
poiSelection [trackPlaybackOptions]="trackOptions">
</div>

正如您所看到的,这可能最终导致不同抽象级别的指令.

我宁愿这样:

<app-our-nice-map poiSelection [poiSelectionOptions]="selectionOptions" [trackPlaybackOptions]="trackOptions">
</app-our-nice-map>

而OurNiceMapComponent组件的模板如下所示:

<div class="map" leaflet [leafletOptions]="options" [leafletLayers]="layers" [leafletOptions]="options">
</div><!-- this is here because Stackoverflow doesn't like single div /-->

这有两个挑战.

1. 找到一个关于更高级别指令如何与更低级别指令(leafletDraw)进行交互/配置(poiSelection)的方法.
2. 如何动态添加指令.正如您在上面的OurNiceMapComponent模板中所看到的,我没有添加leafletDraw,因为它仅由特定的更高级别指令使用.

所以问题是,如何创建这些"更高阶指令".

我有一个项目,我有一个地图(使用ngx-leaflet).
在点击一个标记,我想说明从对话框角材料.

对话框打开但是当我单击关闭按钮时,它会再次重新打开然后关闭.

我尝试了什么:

• 使用超时延迟对话框
• 触发打开对话框的主题
• 删除并创建新的Dialog
• 在ngx-leaflet和angular-material问题中搜索此错误

我发现了什么:

• 发生某些事情后触发所有生命周期钩子(点击,后面的js事件,任何事物)
• Dialog可以很简单,但不会改变任何东西
• 当我关闭时再次打开对话框(在AfterClosed of Dialog中)它正常工作

示例代码的进一步说明:

• 在App.component.ts中,我将一个事件处理程序绑定到每个标记,然后在另一个函数中打开该对话框
• 代码是我在网上找到的这个项目的一个分支(只是更新了依赖项)

演示

我在这里做了一个演示:示例项目.

我是@asymmetrik/ngx-leaflet 和 Angular 的新手，所以这可能只是一个新手问题......

我有一个使用@asymmetrik/ngx-leaflet-tutorial-ngcli的 Angular.io (v5) 项目

现在我想获取我在地图上单击的点的坐标。根据问题 #51 获取点击坐标？，我补充说：

map.on('click', () => { console.log(e.latlng); });

到：

onMapReady(map: Map) {
    map.fitBounds(this.route.getBounds(), {
        padding: point(24, 24),
        maxZoom: 12,
        animate: true
    });
    map.on('click', () => { console.log(e.latlng); });
}

这给了我一个运行时错误： Cannot find name 'e'.

哪种对我有意义。所以，我将代码更改为：

map.on('click', (e) => { console.log(e.latlng); });

但这也给了我一个错误： Property 'latlng' does not exist on type 'LeafletEvent'

当我将 e 放到控制台时，console.log(e)我可以看到 latlng-Property 存在......为什么我不能访问坐标e.latlng？

我的项目正在使用：

"@angular/cli": "1.4.7",
"@asymmetrik/ngx-leaflet": "^2.5.1",
"@types/leaflet": "^1.2.0",
"leaflet": …

我尝试将 GeoJson 文件导入到 angular 应用程序 6 中的传单中。

使用此解决方案，我的 geojson 是在传单图中绘制的，但出现此错误，我无法构建我的应用程序。有人知道一种解决方案吗？

错误 TS2345 类型参数 '{"type": string;"features":({"type": string; "geometry": { "type: string : "coordinates": num...' 不是类型的可分配参数GeoJson 对象

模型.ts

export const Pdl = [ 'my geojson' ];

https://raw.githubusercontent.com/alanent/france-geojson/master/regions/pays-de-la-loire/departements-pays-de-la-loire.geojson

组件.ts

import { LeafletModule } from '@asymmetrik/ngx-leaflet';
import * as L from 'leaflet';
import {Pdl} from "../models/pdl.model"; 

@Component({
   selector: 'app-geo',
   templateUrl: './geo.component.html',
   styleUrls: ['./geo.component.scss']
})
export class GeoComponent implements OnInit { 

    ngOnInit() {    
       var mapboxAccessToken = "...";

       const myfrugalmap = L.map('frugalmap').setView([47.482019, -1], 7);

       L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=' + …

任何好的推荐角度6+支持的库,可用于完成以下任务？

我正在使用ngx-leaflet作为Map.我希望使用Vectors而不是Rasters创建地图.我知道Leaflet默认不支持矢量切片,但是,你可以通过mapbox-gl-leaflet插件完成.

任何人都可以推荐我使用角度6+完成此任务的方法或适当的库吗？

\n

导入没有 \xc9\xb5mod 属性的 LeafletDrawModule

\n

我在单元测试期间看到此错误（开玩笑）。

当我运行 ng 应用程序时，代码运行良好。传单绘制功能完美运行。

Angular: 11\n@asymmetrik/ngx-leaflet: 8.1.0\n@asymmetrik/ngx-leaflet-draw: 7.0.0\n

当单元测试引用 LeafletDrawModule 的组件时会发生此错误

我是传单的新手。我已经按照https://github.com/Asymmetrik/ngx-leaflet上的步骤设置了地图

我正在尝试获取地图放大区域中的标记列表，这些标记可用于使对象成为焦点。我如何用 ngx-leaflet 在 angular 4 中做到这一点？

我正在开发一个 angular 应用程序，它使用传单地图来显示一些图层，我正在尝试使用 GeoJSON，但我无法创建 L.geoJSON 图层。我试图添加一个观点，我发现的每一个资源都告诉我要创建这个结构：

import { geoJSON } from 'leaflet';

geoJSON({
    type: "Point",
    coordinates: [lat,long]
});

但是当我提供应用程序时，我收到此错误：

Argument of type '{ type: "Point"; coordinates: number[]; }' is not assignable to parameter of type 'GeoJsonObject'.
Object literal may only specify known properties, and 'coordinates' does not exist in type 'GeoJsonObject'.

唯一的其他属性type是bbox?.

我确定我做错了什么，但我真的不明白是什么。

使用

"leaflet": "^1.3.1"
"@types/leaflet": "^1.2.5"
"@asymmetrik/ngx-leaflet": "^3.0.2"

我知道这是一个经常出现的问题，可以通过修复导入语句来解决。我目前有

import { LeafletModule } from 'node_modules/@asymmetrik/ngx-leaflet';
import * as L from 'leaflet';
import { } from '@types/leaflet';

我正在引用选项，因此：

options = {
    layers: [
        this.googleHybrid
    ],
    zoom: 1.49,
    zoomSnap: 0,
    center: L.latLng([180, -180])}

我觉得我遇到了这个问题，因为将传单中的所有内容都导入为 L。有什么想法吗？

编辑：我还应该补充一点，这只是在测试中出现。