问题标签 [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 投票
0 回答
576 浏览

typescript - 在 ngx-leaflet 中动态处理折线

我正在尝试在 ngx-leaflet 上使用折线,但我遇到了一些问题。首先,我尝试通过传递硬编码的 latlng 值来声明折线,但如果我尝试传递变量 ti,则会出现以下错误:

我还尝试使用 setLatLngs 方法动态更新坐标,但它不接受 Marker[] 作为坐标:

那么我可以动态创建折线并使用库进行更新吗?我试图建立的最终目的是最终用户具有创建标记并将它们与折线链接的功能。

我想明确说明我只使用标准的“ngx-leaflet”库而不是其他插件。

0 投票
0 回答
148 浏览

angular - 包括外部插件

是否可以在我的ngx-leaflet应用程序中包含外部插件

因为我必须实现Leaflet.LayerGroup.CollisionLeaflet.Arc,但我不知道该怎么做。如果您有任何想法,请告诉我:)

感谢您的任何回答!

0 投票
1 回答
654 浏览

angular - 带有 ngx 传单的 Google 地图样式

我似乎无法使用带有 ngx-leaflet 角度插件的谷歌地图样式向导生成的样式。例如,我使用谷歌地图样式向导来减少地图上显示的标签数量。

想问在代码中的何处应用由样式向导创建的给定 json 对象。

我有以下html:

这个生成的样式:

无法在文档中找到它并尝试了多种方式。有没有办法做到这一点?

0 投票
0 回答
119 浏览

webpack - 层控制不可见Webpack 4

我将 ngx-leaflet 与 webpack 4 一起使用,但在显示图层控制图像时遇到问题。默认标记图标显示得很好,因为我使用文件加载器从 'leaflet/dist/images/layers.png' 等导入图标名。该项目不使用 CLI 并使用独立的 webpack 4。如果我采用相同的代码并在 angular CLI 项目中使用它,则在遵循 Angular CLI Marker Workaround 部分中的资产配置后,图标会很好地显示。我错过了什么?我需要什么才能在不使用 CLI 的情况下显示此图标?我在开发人员工具中没有收到任何错误,并且似乎在网络流量中请求了 layers.png。

这是 webpack 配置:

0 投票
1 回答
735 浏览

angular - Leaflet MarkerCluster removeOutsideVisibleBounds 不起作用

我有一个使用Leaflet.markercluster插件的传单地图。

集群在地图上正确绘制,但我注意到视图之外的集群仍在渲染,即使我将removeOutsideVisibleBounds选项设置为true.

我可以判断的方式是,如果我通过按住鼠标按钮来平移地图,那么在平移时所有集群仍然可见。

集群组的配置如下:

为了确保删除视图之外的集群,我还缺少什么?

该项目使用 ngx-leaflet 在 Angular 5 中。

0 投票
1 回答
972 浏览

angular - 设置当前位置标记

我完成了教程,并将其全部启动并运行。现在我想获取我当前的浏览器位置并在 MapReady 上为其设置一个标记。我对编程很陌生,我刚刚开始学习 Angular,很抱歉这个菜鸟问题:D

我从传单中找到的所有示例(例如这个示例)都不适合我,因为我无法将它们翻译到我的 Angular 项目中。

有人可以帮我弄这个吗?

这是我来自 component.ts 的代码

0 投票
0 回答
889 浏览

angular - 如何在 ngx-leaflet Angular 应用程序中加载和显示外部多多边形 geoJSON 文件

我在这个例子中使用了ngx-leaflet 教程中的模板。我是 Angular 的初学者,对 Leaflet.js 知之甚少,仅供参考。

我有一个大型的多多边形 geoJSON 文件,我想在地图上显示并最终添加交互性。我已将assets目录中的文件保存为china_adm1.geojson.

app.component.html好像:

看起来app.component.ts像:

当我使用上面的代码运行应用程序时,Google 底图显示得很好,但是没有 layersControl 面板。当我删除 layersControl 代码的整个overlays部分时,控制面板会按预期显示。关于加载/显示中国地区 geoJSON,我缺少一些东西。请注意,在 中import { adm1 } from '../assets/china_adm1,我是任意定义adm1的,所以也许这就是问题所在。我也尝试过this.china在图层选项中包含this.googleMaps.

在leaflet.js 中,它就像L.geoJson(adm1).addTo(map);我定义adm1的那样简单

在geojson文件中。我不确定如何正确定义和引用 ngx-leaflet 中的 geojson 文件。

0 投票
2 回答
1285 浏览

typescript - 在 Angular 5 中对标记、圆形和多边形图层进行分组

我在表格和地图中显示了一组位置。我正在为表中的每个元素显示标记和圆形或多边形之一。当我从表格标记中选择蚂蚁元素时,该特定元素的图标会发生变化。我还有一个滑块可以更改每个元素的圆的半径。所有这一切都成功发生了,但我想分别分离标记、圆形和多边形图层,然后使用 layerGroup 对它们进行分组,这样当我更改半径时,我只更新圆形图层(现在我必须重置图层并更新标记、多边形和圆形) . 同样,如果我选择表中的任何元素,那么我应该只更新标记层而不是全部三个。我试图像这样对图层进行分组:

回应是这样的:

我收到以下错误:“尝试区分'[object Object]'时出错。只允许使用数组和可迭代对象”

有什么方法可以有效地实现这一点。

编辑:下面是工作代码。每次单击复选框时,我都会将该元素添加或删除到selectedPlaces. 然后我调用这个函数。即使在滑块更改时,我也必须一次又一次地调用此函数。我在图层中使用标记、多边形和滑块,但我想将图层分成三个部分,这样当我选择任何元素时,我只更新标记(如果可能,则更新该特定元素的标记)而不是所有的圆圈和多边形。如果我使用滑块更新半径,那么我应该能够只更新圆而不修改标记和多边形。

0 投票
0 回答
132 浏览

angular - ngx-leaflet 层的渲染中显示的白线

使用 Leaflet 1.3.1、ngx-leaflet 2.5、Angular 4.4.5

我正在以模式渲染地图,在某些情况下,地图上会形成白线:

像这样

有没有其他人经历过这种情况并知道可能是什么原因造成的?

0 投票
1 回答
2084 浏览

javascript - 在具有角度的 ngx-leaflet 的 featureGroup 上使用 getBounds/fitBounds

在我正在创建的应用程序中,我将点组动态添加到嵌套地图单击事件中引用的 featureGroup。所以要点是我有一张显示不同地区的国家地图。单击一个区域使地图边界适合该多边形并显示与该多边形相关的点,例如城市。单击单个点/城市会进一步深入并显示与第一个单击点相关联的另一组点,例如所选城市内的所有图书馆。

问题是,一旦我的最后一组点(库)位于 featureGroup 中(由于我的点击事件的嵌套性质,这是必要的),我无法在组上使用 fitBounds/getBounds。这是一个最小的示例(基于 ngx-leaflet-tutorial-ngcli 教程):

app.component.html

app.component.ts

我曾经console.log展示过featureGroup的输出:

如您所见,没有_bounds可用的方法。有没有办法让 ngx-leaflet 中的 featureGroup 适应Bounds?