个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
30
4
我正在使用 leaflet.snap ( http://makinacorpus.github.io/Leaflet.Snap/ )，它可以让我在绘制多边形时将点捕捉到线 - 这正是我所需要的。但我很难尝试将多边形设置为可编辑。
这是我的代码，它使用 Leaflet.Snap，并允许绘制但不允许编辑多边形。非常感谢任何使多边形可编辑的帮助。
<!DOCTYPE html>
<html>
<head>
<title>Leaflet Snap Test</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Leaflet -->
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<style>
.leaflet-editing-icon.marker-snapped {
background-color: yellow;
}
</style>
<link rel="stylesheet" href="http://makinacorpus.github.io/Leaflet.Snap/Leaflet.draw/dist/leaflet.draw.css" />
<script src="http://makinacorpus.github.io/Leaflet.Snap/Leaflet.draw/dist/leaflet.draw.js"></script>
<script src="http://makinacorpus.github.io/Leaflet.Snap/Leaflet.GeometryUtil/dist/leaflet.geometryutil.js"></script>
<script src="http://makinacorpus.github.io/Leaflet.Snap/leaflet.snap.js"></script>
</head>
<body>
<div id="map" class="map" style="height: 500px; width: 800px"></div>
<script>
var theTileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: 'Map data © 2013 OpenStreetMap contributors',
});
var map = L.map('map').setView([45.4835656, -122.7332588], 12).addLayer(theTileLayer);
var guideLayers = new Array();
var drawnItems = new L.FeatureGroup();
map.addLayer(drawnItems);
var drawControl = new L.Control.Draw({
position: 'topright',
draw: {
polyline: false,
polygon: {
shapeOptions: {
color: '#009900'
}
},
circle: false, // Turns off this drawing tool
rectangle: false,
marker: false
},
edit: {
featureGroup: drawnItems, //REQUIRED!!
remove: true
}
});
map.addControl(drawControl);
// Editing lines works fine on the sample (http://makinacorpus.github.io/Leaflet.Snap/) but not below.
drawControl.setDrawingOptions({
polygon: { guideLayers: guideLayers, snapDistance: 15 },
});
map.on('draw:created', function (e) {
var layer = e.layer;
map.addLayer(layer);
guideLayers.push(layer);
});
</script>
</body>
</html>
最佳答案
只是您在任何绘图完成时错过了向 DrawingItems 添加图层。只需在代码中将“map”替换为“drawnItems”，如下所示，它就会起作用:
map.on('draw:created', function (e) {
var layer = e.layer;
drawnItems.addLayer(layer);
guideLayers.push(layer);
});
享受吧!
关于javascript - 在 leaflet.js 和 leaflet.snap 中编辑多边形，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25331909/
30
4
0
我已经实现了 Bentley-Ottmann-algorithm检测多边形-多边形交叉点。这通常非常有效:由于多边形不自相交，因此两个多边形的线段并集中的任何线段相交表明两个多边形相交。 但是如果我看
我在 Silverlight 中有一个多边形(棋盘游戏的十六进制)，例如； public class GridHex : IGridShape { ..... public IList
我创建了一个简单的 DirectX 应用程序来渲染一个顶点场。顶点呈现如下(如果从顶部查看): |\|\|\|\| |\|\|\|\| 每个三角形都是这样渲染的: 1 |\ 2 3 这应该意味着多边形
我的代码的某些部分here : var stage = new Kinetic.Stage({ container: "canvas", width: 300,
我正在尝试从 map 数据构造导航网格物体。步骤之一涉及将二进制图像(其中0表示占用空间，1表示自由空间)转换成平面直线图。 我正在尝试找到一种可靠的方法。我目前的想法是使用Canny边缘检测器，然后
我的任务是编写 MATLAB 代码来生成一个由 4 部分组成的 Logo ，如屏幕截图所示。左上角应为黑色，右下角应为白色。另一个程序应随机选择两种颜色。 我采取了以下方法: clear all cl
很难说出这里要问什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或夸夸其谈，无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开，visit the help center . 关闭 1
如何向 google.maps.Rectangle 和 google.maps.Polygon 添加标题？ title 属性在 RectangleOptions 中不可用.我试过了，但没用(对于 go
我有一个表，用于将表上的段存储为多边形。然后我想获取所有被另一个多边形接触的线段，例如正方形或圆形。图片上:http://img.acianetmedia.com/GJ3 我将灰色小框表示为段和 bi
我正在我的网站上使用 CSS 来制作形状。它在 chrome 中运行良好，但在 mozilla、internet explorer 中打开时，它无法运行。 有人知道怎么解决吗？ 这是 fiddle h
我使用 DrawingManager 在 Google map 上绘制圆形和多边形。我尝试使用下面的代码删除圆形/多边形。 selectedShape.setMap(null); 这里selected
我看到了很多如何检测碰撞的教程，但没有看到如何解决它。我正在制作一个自上而下的游戏，玩家具有圆形碰撞形状，而墙壁是各种多边形。 我正在使用 slick2d。我应该做的是，如果玩家与角落碰撞，我会按法线
我对 tkinter 比较陌生，我正在制作一个只使用正方形的游戏。我正在抄写的书只显示三角形。这是代码: # The tkinter launcher (Already complete) from
我在 OpenCV/Python 中工作，我遇到了这个问题。我已经使用 cv2.minAreaRect() 来获取围绕一组点的边界框。是否有任何其他函数/通用算法可以给我内接多边形(点集)的最大矩形？
如果给定一组线段 S ，我们能否设计一种算法来测试集合 S 中的线段是否可以形成多边形，我对它们是否相交多边形不感兴趣，我只想知道我可以测试什么标准， 任何建议 最佳答案 构建一个图形数据结构，其中节
如何从多个地理位置(经度、纬度值)创建多边形地理围栏。此外，如何在 Android 上跟踪用户进入此地理围栏区域或从该区域退出。 最佳答案 地理围栏只是一组形成多边形的纬度/经度点。获得纬度/经度点列
我想要一个 complex image like this在我的申请中。我想让用户点击复杂的多边形(在这种情况下是有边界的国家/地区)并突出显示他们点击的多边形。我有我需要用于该状态的图像。 我怎样才
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的，
我想在 python tkinter 中移动对象，特别是多边形。问题出在 is_click 函数中。我似乎无法弄清楚如何确定我是否单击了该对象。代码还没有 100% 完成，移动仍然需要完成，但我现在需
我有一个大多边形，我想找到与该多边形相交的要素，但由于多边形太大，我遇到超时异常。 我试图研究 JTS 方法，但不知道如何使用它。 final List coordinates = List.of(n
我是一名优秀的程序员,十分优秀！