问题标签 [ngx-leaflet]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
903 浏览

angular - 在 Angular 项目中使用带有 ngx-leaflet 地图的 heatmap.js 插件更改半径

我在 Angular 项目中使用带有 @asymmetrik/ngx-leaflet 的 heatmap.js 库,以显示用户位置的热图。

我使用地图的边界来创建一个多边形,并用它带来其中位置的聚合计数。我能够带来和显示数据,但我希望半径随着缩放而相应改变。

我已将 scaleRadius 设置为 true,但它没有按预期工作:例如,如果我选择像 1 这样的半径,当我放大半径时,半径会变得太大。如果我在缩小时更改为小半径,它会变得很小。所以,我做了一些测试并得出了这个值(我设置了最小缩放和最大缩放):

我想也许我可以使用传单'zoomend'的事件处理程序来检测缩放的变化并以某种方式改变半径。我是不是把事情复杂化了?有可能做这样的事情吗?谢谢你。

我的代码是:

模板:

零件:

我使用了本教程:https ://github.com/Asymmetrik/ngx-leaflet-tutorial-plugins/tree/master/heatmap.js

0 投票
1 回答
706 浏览

angular - 为什么 Angular 2 中的 ngx-leaflet 在通过 *ngif 更改状态后不渲染地图

我在 Angular 2 中遇到了 ngx-leaflet 组件的问题。在将 *ngif 的状态从 true 更改为 false 并在地图出现时再次从 false 更改为 true 后,没有出现瓷砖渲染。我该怎么做才能避免这个问题?

这是我的 html 代码

这是我的打字稿代码

0 投票
1 回答
1754 浏览

angular - 运行 ng build --prod 时传单标记图标 url 编译错误

由于某种原因,Leaflet 标记图标 url 在运行时编译错误,而ng build --prod不是在运行ng buildLeaflet 标记图标 url 时很好。

我的环境:

您可以在此url下找到 prod env

屏幕截图显示了错误编译的图标标记 url 的示例。

ng build --prod 时传单标记图标 url 编译错误

我想这与 Leaflet 上的这个问题有关,但我不知道如何解决这个问题。

0 投票
1 回答
1267 浏览

angular - 如何使用 ngx-leaflet(Angular 方式)创建矢量图块地图?

有什么好的推荐的 Angular 6+ 支持的库可以用来完成以下任务吗?

我使用ngx-leaflet作为地图。我希望使用Vectors 而不是 Rasters创建地图。我知道 Leaflet 默认不支持矢量图块,但是,您可以通过mapbox-gl-leaflet插件来完成。

任何人都可以向我推荐一种方法或适当的库来使用 Angular 6+ 完成这项任务吗?

0 投票
1 回答
1358 浏览

angular7 - 如何使用 ngx-leaflet-draw 为 ngx-leaflet 创建自定义绘制按钮

我想创建一个自定义按钮,它可以在单击时启用折线抽屉。它类似于How to click a button and start a new polygon without using the Leaflet.draw UI,但我想用angular (7),ngx-leafletngx-leaflet-draw.

这是我的角度项目链接中的改编代码:

这是我的html:

如果我单击“绘制折线”按钮,则会收到错误消息:

ERROR TypeError: Cannot read property 'overlayPane' of undefined at NewClass.initialize (leaflet.draw.js:8) at NewClass.initialize (leaflet.draw.js:8) at new NewClass (leaflet-src.js:301)

我的代码有什么问题?

0 投票
1 回答
1392 浏览

leaflet - 如何添加多组标记?

我需要在我的地图上绘制多层图标。必须通过单击选项面板来呈现或不呈现每组该图标。我找到了所有显示如何添加单个标记或一组标记的示例,但没有关于多个组的内容。

我正在与 Asymmetrik/ngx-leaflet 一起工作,但我认为我缺少的概念适用于所有实现。

我怎样才能在地图上以单独的方式放置这个“层”?

0 投票
1 回答
1495 浏览

angular - 如何找到添加到leafletLayer的多个标记的边界

我在 Angular 6 项目中使用 ngx-leaflet,我在地图中绘制了多个标记,我想在多个标记上居中并缩放传单地图

在官方文档中,您可以使用 [L.latlngBounds] 来完成,并使用找到其他解决方案L.featureGroup

由于我使用的是 ngx-leaflet,所以我没有L变量,所以我找不到latlngBoundsfeatureGroup

这是我的组件:

还有我的模板:

谢谢你的帮助

0 投票
1 回答
356 浏览

angular - 使用带有 ngx-leaflet 的 vectorGrid 时的地图滚动性能问题

我正在使用 Leaflet + VectorGrid + ngx-leaflet 在 Angular 应用程序的地图上显示矢量切片。但是,当显示的点太多时,滚动变得非常缓慢且不可能。减少点数可以改善这种情况。

简单地使用 Leaflet + Vectorgrid 时,相同的场景效果很好(plunker),所以我相信在使用 ngx-leaflet 时会发送一些鼠标事件。我该如何改善这种情况?我已经在ngx-leaflet 的演示应用程序上重现了该问题,但无法使其与 plunker 一起使用。

0 投票
1 回答
180 浏览

angular - 如果我决定在没有 ngx-leaflet 库的情况下在 Angular 中使用传单,我需要照顾自己什么?

最近,我发现了一篇博客文章,其中展示了如何在不使用 ngx-leaflet 的情况下将传单与 Angular 一起使用:https ://codehandbook.org/use-leaflet-in-angular/

如果我不使用 ngx-leaflet,我必须照顾自己什么?目前,地图显示、点击事件、标记、圆圈和多边形等基本功能都可以使用,但我担心更高级的功能。

我知道我可能会遇到 ChangeDetection 和 Selectors 的问题,但是有谁知道我在其他哪些地方会遇到问题以及这些问题会出现在什么地方?

0 投票
1 回答
2557 浏览

angular - ngx-leaflet:如何添加自定义控件?

我已经尝试了一段时间使用ngx-leaflet.

在按照教程进行操作时,绝对没有关于如何实现自定义控件或图例的明确文档。

在此处输入图像描述

创造传奇也是如此。

任何人都可以指出我正确的方向来尝试使用 ngx-leaflet lib 在 Angular 7 中实现它吗?

我知道你需要做这样的事情但我不想添加圆​​形或形状,而是上面屏幕截图中的自定义控件以及图例。