ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix Snap -> Interaction

Browse Source 
This commit changes ol.Snap -> ol.interaction.Snap, which extends
ol.interaction.Pointer.  The 'pointerdown', 'pointermove' and
'pointerup' map browser events are hanlded to edit the pixel and
coordinate properties to make them 'snap' to the closest feature.
This commit is contained in:
Alexandre Dubé
2015-03-25 15:10:41 -04:00
parent 7d20e2a317
commit d92917ac89
4 changed files with 766 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
examples/snap.html Normal file
View File

@@ -0,0 +1,77 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<link rel="stylesheet" href="../css/ol.css" type="text/css">
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="../resources/layout.css" type="text/css">
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
<title> Snap example </title>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div class="row-fluid">
<div class="span12">
<h4 id="title">Snap interaction example</h4>
<p id="shortdesc">Example of using the snap interaction together with
draw and modify interactions. The snap interaction must be added
last, as it needs to be the first to handle the
<code>pointermove</code> event.</p>
<form id="options-form" automplete="off">
<div class="radio">
<label>
<input type="radio" name="interaction" value="draw" id="draw" checked>
Draw &nbsp;
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="interaction" value="modify">
Modify &nbsp;
</label>
</div>
<div class="form-group">
<label>Draw type &nbsp;</label>
<select name="draw-type" id="draw-type">
<option value="Point">Point</option>
<option value="LineString">LineString</option>
<option value="Polygon">Polygon</option>
</select>
</div>
</form>
<div id="docs">
<p>See the <a href="snap.js" target="_blank">snap.js source</a> to see how this is done.</p>
</div>
<div id="tags">draw, edit, modify, vector, featureoverlay, snap</div>
</div>
</div>
</div>
<script src="../resources/jquery.min.js" type="text/javascript"></script>
<script src="../resources/example-behaviour.js" type="text/javascript"></script>
<script src="loader.js?id=snap" type="text/javascript"></script>
</body>
</html>