问题标签 [leaflet.draw]

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 回答
128 浏览

javascript - Leaflet.js 绘制控件不能在整个地图窗口区域移动

我正在使用Leaflet.js绘图控件在我的地图上制作标记和多边形。

当我选择绘制控件来放置标记或多边形时,它会按照预期在大约 80% 的地图窗口上跟随我的鼠标,但是绘制控件无法访问左上角的大部分地图窗口。

此图显示地图,x 显示区域是绘图控件无法到达的区域。绘图控件位于窗口的右下角。

有什么想法可能会在这里发生吗?

0 投票
3 回答
4330 浏览

javascript - 围绕传单地图中的点旋转多边形

我有一个问题,在我的传单地图中,我从多边形创建了一个三角形:

我想旋转这个多边形Point[decimal_lon, decimal_lat]。但我无法解决它。
我创建了DEMO,我正在旋转多项式,我想旋转我的三角形(多边形)来向你展示我的问题。

0 投票
1 回答
729 浏览

javascript - 如何使用不同的工具提示插件模仿 Leaflet.Draw 工具提示样式?

我正在尝试在也使用leaflet.draw 的地图上实现类似leaflet.draw 的行为(使用Draw 来放置标记,然后使用自定义js 来绘制路线)。因此,我希望这个自定义绘图功能的有用工具提示看起来像绘图工具提示。

我该怎么做?我目前正在使用 jquery-ui v. 1.11.4,但我无法确定外观是否相同。我从 Leaflet.draw 中找到了css 的相关部分,但是当尝试按照下面(从这里)在构造函数中使用tooltipclass 属性时,两个 leaflet.draw 类被添加到工具提示中(并且显然被现有的 jquery 覆盖-ui 类)。

似乎有两种可能的解决方案:
1. 创建我自己的leaflet.draw 工具提示
实例 2. 找到一种方法从 jquery-ui 工具提示中删除冲突的 CSS 类。

0 投票
1 回答
442 浏览

javascript - 识别要删除的多边形

我想知道如何在传单(.draw)中为多边形提供(和检索)ID。我需要这个,因为我希望能够告诉数据库要删除/编辑哪个多边形。

提前致谢

编辑:

在我的数据库中,我保存了一个 polygon_ID 和一个多边形的坐标。这是我保存多边形的代码:(当我完成绘制多边形时触发)

这是我的 send.php:

这就是我在多边形中加载的方式:

我真的希望这能澄清事情。

0 投票
1 回答
393 浏览

javascript - 功能惊人地改变了传单地图中的多边形坐标

我正在尝试为传单地图创建一些功能,为每个创建的标记添加具有特定旋转的三角形。
这是创建标记和添加三角形的功能(效果很好):

当我这样调用函数时:add_items_to_map( map, 0, 0, path[0], 'green', 270, 90 );一切正常,三角形旋转如下图所示:

<一个href=

问题是当最后一行 -var rot_polygon = rotate_polygon( polygon.getLatLngs(), rotation_of_polygon );我的函数被调用时。
这个函数看起来像这样:

这就是我调用它时发生的情况: <一个href=

它修改创建的多边形中的坐标。你有什么想法为什么?

0 投票
0 回答
777 浏览

leaflet - 将自定义顶点添加到 Leftlet LineString / Polyline

我在这里有一个普通的 Leaflet Draw 页面,当我不处于编辑模式时,我想在一些也会响应点击事件的顶点中有自定义顶点图标,显示一个弹出窗口。

我环顾四周,似乎我需要截取线条的渲染并在那里绘制我的图标。

我对添加标记不感兴趣,我只想在顶点上添加/绑定一个图标,就像 Leaflet Draw 在编辑模式下所做的那样并显示白色小矩形。

这是我在退出编辑模式时想要实现的想法。看起来像这样的东西(请原谅我的绘画技巧!) 在此处输入图像描述

我想我可以用类似的东西访问顶点myLine.geometry.features[0].coordinates

有人可以指出我正确的方向吗?我在哪里拦截render while not in editing事件?如何绑定和图标顶点?

0 投票
3 回答
3322 浏览

leaflet - 将 FeatureGroup 转换为 GeoJson 时,Leaflet Draw 不获取属性

我无法使用 Leaflet(0.7.7)/Leaflet.Draw(latest) 将我的 Layer 属性转换为 GEOJson 对象的属性。我的工作流程是:

1 创建地图:var map = L.map('#map', options);

2 创建功能组:features= new L.FeatureGroup();

3 添加到传单地图: map.addLayer(features);

4 在draw:created活动中,我正在捕获e.layer并添加一堆属性:

var layer = e.layer;

layer.properties = { Title: 'Hello' };

features.addLayer(layer);

geo_features = features.toGeoJSON();

但是,我geo_features在每个功能中总是有空的属性属性,我无法弄清楚!

0 投票
1 回答
632 浏览

leaflet - Leaflet.Draw 矩形的自定义波浪路径

如何将自定义路径样式应用于 Leaflet.draw 中的矩形?我一直在玩 CSS 并且可以设置它的样式,但我只能使用 stroke-width、stroke-dasharray 等。我们正在构建一个允许人们标记照片并希望实现“照片”的地图框架”之类的感觉。可能吗?在此处输入图像描述

0 投票
0 回答
976 浏览

javascript - Leaflet.draw geojson 图层编辑

正如你在这个小提琴中看到的,我有一个像这样的多边形:

当我想将它添加到我的功能组时,drawnItems我使用:

然后我决定编辑多边形我不能移动它,因为中央移动处理程序没有出现,但是当我使用工具栏绘制新多边形时,我有移动处理程序。 在此处输入图像描述

请你帮助我好吗?如何添加我的多边形以具有移动处理程序?

0 投票
1 回答
1118 浏览

javascript - 如何使用传单地图创建带有数字的热图?

我希望创建一个如下所示的热图,数字在不同的缩放级别发生变化 - 数字可以出现在鼠标悬停窗口中,而不是直接显示在地图上:

在此处输入图像描述

知道如何用 Leaflet 地图制作这个吗?

编辑:

我试过 heatmap.js。但它无法在地图上显示数字。

编辑2:

我有一个包含三列的 csv 文件:

任何提示如何轻松为 Leaflet.markercluster加载它?