Skip to content

Commit

Permalink
Rolling version up, snapping example (partial) and new dist
Browse files Browse the repository at this point in the history
  • Loading branch information
Jon West committed Jul 6, 2016
1 parent d26e091 commit fb8c2dd
Show file tree
Hide file tree
Showing 7 changed files with 181 additions and 10 deletions.
3 changes: 1 addition & 2 deletions bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "leaflet-draw",
"description": "Vector drawing plugin for Leaflet",
"version": "0.3.0",
"version": "0.3.1",
"main": [
"dist/leaflet.draw-src.js",
"dist/leaflet.draw.css",
Expand Down Expand Up @@ -51,7 +51,6 @@
"leaflet": "^0.7.0"
},
"devDependencies": {
"leaflet": "~0.7.0",
"jshint": "~2.3.0",
"uglify-js": "~2.4.3",
"jake": "~0.7.4",
Expand Down
14 changes: 11 additions & 3 deletions dist/leaflet.draw-src.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,6 +184,7 @@ L.Draw.Feature = L.Handler.extend({

// Cancel drawing when the escape key is pressed
_cancelDrawing: function (e) {
this._map.fire('draw:canceled', { layerType: this.type });
if (e.keyCode === 27) {
this.disable();
}
Expand Down Expand Up @@ -277,6 +278,10 @@ L.Draw.Polyline = L.Draw.Feature.extend({
});
}

if (!L.Browser.touch) {
this._map.on('mouseup', this._onMouseUp, this); // Necessary for 0.7 compatibility
}

this._mouseMarker
.on('mousedown', this._onMouseDown, this)
.on('mouseout', this._onMouseOut, this)
Expand Down Expand Up @@ -402,7 +407,9 @@ L.Draw.Polyline = L.Draw.Feature.extend({
},

_onZoomEnd: function () {
this._updateGuide();
if (this._markers !== null) {
this._updateGuide();
}
},

_onMouseMove: function (e) {
Expand Down Expand Up @@ -691,7 +698,8 @@ L.Draw.Polygon = L.Draw.Polyline.extend({
fillColor: null, //same as color by default
fillOpacity: 0.2,
clickable: true
}
},
metric: true // Whether to use the metric measurement system or imperial
},

initialize: function (map, options) {
Expand Down Expand Up @@ -1297,7 +1305,7 @@ L.Edit.PolyVerticesEdit = L.Handler.extend({
var poly = this._poly;

if (!(poly instanceof L.Polygon)) {
poly.options.editing.fill = false;
poly.options.fill = false;
}

poly.setStyle(poly.options.editing);
Expand Down
4 changes: 2 additions & 2 deletions dist/leaflet.draw.js
View file

Large diffs are not rendered by default.

164 changes: 164 additions & 0 deletions examples/snapping.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,164 @@
<!DOCTYPE html>
<html>
<head>
<title>Leaflet.draw drawing with snapping</title>

<link rel="stylesheet" href="libs/leaflet.css" />
<link rel="stylesheet" href="../dist/leaflet.draw.css" />

<script src="libs/leaflet-src.js"></script>

<script src="../src/Leaflet.draw.js"></script>

<script src="../src/edit/handler/Edit.Poly.js"></script>
<script src="../src/edit/handler/Edit.SimpleShape.js"></script>
<script src="../src/edit/handler/Edit.Circle.js"></script>
<script src="../src/edit/handler/Edit.Rectangle.js"></script>

<script src="../src/draw/handler/Draw.Feature.js"></script>
<script src="../src/draw/handler/Draw.Polyline.js"></script>
<script src="../src/draw/handler/Draw.Polygon.js"></script>
<script src="../src/draw/handler/Draw.SimpleShape.js"></script>
<script src="../src/draw/handler/Draw.Rectangle.js"></script>
<script src="../src/draw/handler/Draw.Circle.js"></script>
<script src="../src/draw/handler/Draw.Marker.js"></script>

<script src="../src/ext/TouchEvents.js"></script>
<script src="../src/ext/LatLngUtil.js"></script>
<script src="../src/ext/GeometryUtil.js"></script>
<script src="../src/ext/LineUtil.Intersect.js"></script>
<script src="../src/ext/Polyline.Intersect.js"></script>
<script src="../src/ext/Polygon.Intersect.js"></script>

<script src="../src/Control.Draw.js"></script>
<script src="../src/Tooltip.js"></script>
<script src="../src/Toolbar.js"></script>

<script src="../src/draw/DrawToolbar.js"></script>
<script src="../src/edit/EditToolbar.js"></script>
<script src="../src/edit/handler/EditToolbar.Edit.js"></script>
<script src="../src/edit/handler/EditToolbar.Delete.js"></script>

<script src="https://rawgit.com/makinacorpus/Leaflet.Snap/gh-pages/leaflet.snap.js"></script>
<script src="https://rawgit.com/makinacorpus/Leaflet.GeometryUtil/master/dist/leaflet.geometryutil.js"></script>
</head>
<body>
<div id="map" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
<button id="changeColor">Rectangle -> Blue</button>
<script>
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib}),
map = new L.Map('map', {layers: [osm], center: new L.LatLng(48.48988, 1.39638), zoom: 14 });

var drawnItems = new L.FeatureGroup();
map.addLayer(drawnItems);

// Set the title to show on the polygon button
L.drawLocal.draw.toolbar.buttons.polygon = 'Draw a sexy polygon!';

var drawControl = new L.Control.Draw({
position: 'topright',
draw: {
polyline: true,
polygon: true,
circle: false,
marker: true
},
edit: {
featureGroup: drawnItems,
remove: true
}
});
map.addControl(drawControl);

var guides =
L.polyline([
[48.505431207150885, 1.3999843597412107],
[48.50335551764662, 1.398911476135254],
[48.50173471468476, 1.3994693756103516],
[48.49974418399956, 1.3991689682006836],
[48.49684355649577, 1.3993835449218748],
[48.4956206932084, 1.398611068725586],
[48.49465375716902, 1.3980531692504883],
[48.49419872206354, 1.3975811004638672],
[48.492406981637345, 1.3971948623657227],
[48.49156797030711, 1.396486759185791],
[48.49067206152607, 1.3961219787597656],
[48.48988, 1.39638],
[48.489342389949364, 1.394963264465332],
[48.48864554279267, 1.3944590091705322],
[48.487628697617744, 1.3940191268920896],
[48.485666057669334, 1.3944482803344727],
[48.48541005555473, 1.3942551612854002],
[48.48461359626773, 1.3942766189575195],
[48.483489998505746, 1.3933539390563965],
[48.48164098598135, 1.3928818702697754],
[48.480232846617845, 1.3912296295166016],
[48.479450530080534, 1.3906073570251463],
[48.478511734309954, 1.3902640342712402],
[48.47714618217502, 1.389319896697998],
[48.47600819398379, 1.388998031616211]
], {
weight: 5,
color: 'red',
opacity: 1.0
}).addTo(map);

var marker = L.marker([48.488, 1.395]).addTo(map);
marker.snapediting = new L.Handler.MarkerSnap(map, marker);
marker.snapediting.addGuideLayer(guides);
marker.snapediting.enable();
var road = L.polyline([
[48.48922, 1.40033],
[48.48935, 1.39981],
[48.48948, 1.3976],
[48.48986, 1.39634]
], {
color: 'green',
opacity: 1.0
}).addTo(map);

road.snapediting = new L.Handler.PolylineSnap(map, road);
road.snapediting.addGuideLayer(guides);
road.snapediting.enable();
marker.snapediting.addGuideLayer(road);

var guideLayers = [guides, road];
drawControl.setDrawingOptions({
polyline: { guideLayers: guideLayers },
polygon: { guideLayers: guideLayers, snapDistance: 5 },
marker: { guideLayers: guideLayers, snapVertices: false },
rectangle: false,
circle: false
});

map.on('draw:created', function (e) {
var type = e.layerType,
layer = e.layer;

if (type === 'marker') {
layer.bindPopup('A popup!');
}

drawnItems.addLayer(layer);
});

map.on('draw:edited', function (e) {
var layers = e.layers;
var countOfEditedLayers = 0;
layers.eachLayer(function(layer) {
countOfEditedLayers++;
});
console.log("Edited " + countOfEditedLayers + " layers");
});



L.DomUtil.get('changeColor').onclick = function () {
drawControl.setDrawingOptions({ rectangle: { shapeOptions: { color: '#004a80' } } });
};

</script>
</body>
</html>
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "leaflet-draw",
"version": "0.3.0",
"version": "0.3.1",
"description": "Vector drawing plugin for Leaflet",
"devDependencies": {
"happen": "~0.1.3",
Expand Down
2 changes: 1 addition & 1 deletion src/draw/handler/Draw.Polyline.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ L.Draw.Polyline = L.Draw.Feature.extend({
});
}

if(!L.Browser.touch){
if (!L.Browser.touch) {
this._map.on('mouseup', this._onMouseUp, this); // Necessary for 0.7 compatibility
}

Expand Down
2 changes: 1 addition & 1 deletion src/edit/handler/Edit.Poly.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ L.Edit.PolyVerticesEdit = L.Handler.extend({
var poly = this._poly;

if (!(poly instanceof L.Polygon)) {
poly.options.editing.fill = false;
poly.options.fill = false;
}

poly.setStyle(poly.options.editing);
Expand Down

0 comments on commit fb8c2dd

Please sign in to comment.