问题标签 [leaflet-geoman]

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 投票
1 回答
593 浏览

javascript - Leaflet - 使用 Leaflet-Geoman 插件选择多个 geoJSON 多边形特征

我正在创建一个应用程序,该应用程序需要从 geoJSON 文件中选择多个多边形特征并突出显示它们。

我已经设法使用 Leaflet-Geoman 插件并附加侦听器 map.on('pm:create',并使用绘制形状的 latLngBounds 使用相交从文件中进行选择来完成此操作。

但是,因为我还使用了 geoJSON 特征中的 latLngBounds,所以它选择了绘制形状范围之外的特征。我知道这是由于使用了 latLngBounds,它使用要素的东北角和西南角创建了一个边界框,而不仅仅是要素本身的几何形状。

有没有办法使用 pm:create 插件做出正确的选择,或者有更好的方法来解决这个问题?

下面是我正在使用的代码片段。

代码片段

0 投票
1 回答
1138 浏览

javascript - Leaflet-geoman 如何正确检索 GeoJSON

在使用leaflet-geoman 提供的绘制控件时,我遇到了一些麻烦:

我想要达到的目标:

  • 绘制多边形 --> ✅</li>
  • 从层获取geojson --> ✅</li>
  • 存储在数据库中 --> ✅</li>
  • 从数据库中检索 --> ✅</li>
  • 加载传单地图并能够对其进行编辑、裁剪和删除。--> ✅ ?
  • 从修改后的层获取新的 geojson,或者如果我有 2 层并删除了一层,则只获取一层。--> X

我无法从我通过 geoman 绘制控件所做的修改中获得新的 geojson。无论我做什么,当我将数据加载到地图时,我总是得到相同的结果。

小提琴:https ://jsfiddle.net/pjkLr41q/34/

我不确定是不是因为我加载数据的方式,直接使用 L.geoJSON(data) 或者可能通过 eachLayer 函数在这种情况下不是我需要的,但我现在有点迷路了。帮助真的很感激。

0 投票
1 回答
57 浏览

javascript - 设置类属性的事件监听器

我将 Leaflet 和 Leaflet-geoman 与 wfs-t 结合使用来创建可编辑的地图对象。我有一个类 EditMap,它有一个传单地图作为属性。我正在尝试在此地图上为每个班级收听“pm:create”事件。这是我的代码:

我收到错误 Uncaught SyntaxError: Unexpected token '.' 在这条线上:

我希望我错过了一些简单的东西。我的基本问题归结为:如何监听对象属性上的事件?

0 投票
1 回答
256 浏览

leaflet - 检查重复标记传单风水师

我正在尝试检查每个 geojson 功能是否是标记。如果是我想删除放置的图层,然后再次初始化绘图标记。

如果不是同一个位置,我就把它加到要素图层上。

问题在于 eachLayer 它总是返回 true,因为它循环遍历所有层,并且总是返回 true,因为标记已添加到特征中。所以它总是重复。

这是小提琴,我忘了添加重要代码。 https://jsfiddle.net/2ftmy0bu/2/

0 投票
1 回答
56 浏览

javascript - 如何在我的代码 later.on 中使用在事件内部生成的变量(Leflet 层数组)

我有一个事件,在地图上绘制多边形后,会生成一个包含位于多边形上的兴趣点的传单图层数组。这个活动很好。

关键是我想将这个层数组保存在变量中的某个位置,以便以后在我的代码中使用它。我认为这是一个简单的问题,但我是 Javascript 和 Leaflet 的新手,无法找到解决方案。这是我的代码:

我想稍后在我的代码中使用 var lyrPoi

0 投票
1 回答
144 浏览

leaflet - 如何获取 L.DivIcon 传单的实例

我正在尝试将类添加到工作正常的标记中。但是,当它是 divIcon 时,它需要不同的样式。因此,如果 Instance 是 DivIcon,我将尝试设置另一个 className。

下面的代码总是正确的,因为 L.divIcon 仍然是一个标记(?)

e.target instanceof L.Marker && e.target instanceof L.DivIcon也行不通

0 投票
2 回答
290 浏览

leaflet - 使用传单 geoman 提高大量对象的传单性能

我正在努力寻找任何解决方案来提高地图上有很多对象的传单地图的性能。

我做了什么;

用画布渲染我能做的一切。我的问题是我有很多需要图像图标的标记。这不是由画布呈现的。

我尝试使用 MarkerCluster 并使其与传单 geoman 兼容,但我不得不放弃它。

在这一点上存在哪些选项来提高性能,仍然允许通过传单几何人编辑对象?

这看起来确实很有趣https://github.com/MazeMap/Leaflet.LayerGroup.Collision 但也不兼容编辑。

0 投票
1 回答
584 浏览

leaflet - 如何将 geoman-io 与 ngx-leaflet 一起使用

我正在尝试在 ngx-leaflet 应用程序中使用 geoman-io 插件( https://github.com/geoman-io/leaflet-geoman )。我找到了这篇文章:Integrate EasyButton, Geoman with ngx-leaflet,但是这篇文章中提供的唯一对我有用的解决方案是使用这样的括号表示法:

map["pm"]["addControls"]({position: 'topleft'});

我想这不是最好的方法。所以我的问题是如何在 ngx-leaflet 中正确使用 geoman-io?

当我完全尝试这些步骤时,它不起作用,因为map.pm.addControls({...})我得到错误

“地图”类型上不存在属性“pm”

脚步:

  1. npm i @geoman-io/leaflet-geoman-free
  2. 在组件中导入 geomanimport '@geoman-io/leaflet-geoman-free';
  3. 在“build”部分的 angular.json 中导入 geoman 样式:
  1. 我的组件:

我的 package.json 文件:

如果我将 onMapReady 函数更改为onMapReady(map: L.Map),它会引发相同的错误。感谢帮助!

0 投票
1 回答
207 浏览

leaflet - 地图拖动后保持关注画布层

我有一个来自小册子画布标记的 L.canvasMarker

Leaflet-Geoman的编辑模式下,我可以毫无问题地移动标记。但是如果我拖动地图然后尝试拖动标记,它就不起作用(它失去了焦点)。为了能够再次拖动它,我必须先单击它,然后才能再次正常拖动它。

我解决这个问题的尝试是获取标记的 DOM 元素,然后触发 focus() 事件。但我不知道如何访问传单层 DOM 元素。

我尝试修复以下内容:

从传单地理人捕捉也不起作用,但我想必须对捕捉计算进行更改才能使其起作用。这是一个完全独立的问题。

这是一个小提琴:移动标记->拖动地图->尝试再次移动标记。

https://jsfiddle.net/nkmtLdc5/

0 投票
1 回答
100 浏览

leaflet - Leaflet geoman setLatLngs 未将对象恢复到 getLatLngs 位置

我有一个问题,当传单 geoman 删除例如多边形上的顶点时,我无法恢复对象的 latLngs。

我在做什么:在对象上单击 -> object.getLatLngs()。工作正常。

如果我开始编辑对象然后object.setLatLngs(ObjectClickLatLngs)它工作正常。

但问题是:单击对象-> 开始编辑-> 右键单击​​顶点(删除顶点)-> object.setLatLngs(ObjectclickLatLngs)。现在顶点被删除并且没有恢复到之前的纬度。

尝试单击多边形,更改顶点然后单击“将对象恢复到初始位置”(按预期工作)然后单击多边形,但右键单击顶点(删除)而不移动它,然后单击“将对象恢复到初始位置”(现在对象不在应有的状态,预计它会恢复到与初始相同的位置)

https://jsfiddle.net/6tzxg2ds/2/