Checking for intersections between geometries in Leaflet
When layers are drawn over the existing geometry with Leaflet.draw, markers are created at the points of intersection.
HTML
<script src="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.css">
<script src="https://api.mapbox.com/mapbox.js/plugins/leaflet-draw/v0.2.2/leaflet.draw.js"></script>
<link rel="stylesheet" href="https://api.mapbox.com/mapbox.js/plugins/leaflet-draw/v0.2.2/leaflet.draw.css">
<div id="map"></div>
CSS
html, body, #map {
height: 100%;
width:100%;
padding:0px;
margin:0px;
}
JavaScript
////////////////////////////////////////////////////////////////////////////////////////////
//setting up the map//
////////////////////////////////////////////////////////////////////////////////////////////
// set center coordinates
var centerlat = 34;
var centerlon = -118.25;
// set default zoom level
var zoomLevel = 10;
// initialize map
var map = L.map('map', {
zoomControl: false
}).setView([centerlat, centerlon], zoomLevel);
// set source for map tiles
ATTR = '© <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a> | ' +
'© <a href="http://cartodb.com/attributions">CartoDB</a>';
CDB_URL = 'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png';
// add tiles to map
L.tileLayer(CDB_URL, {attribution: ATTR}).addTo(map);
////////////////////////////////////////////////////////////////////////////////////////////
//some geometry to test against//
////////////////////////////////////////////////////////////////////////////////////////////
var poly = {
"type": "MultiPolygon",
"coordinates": [
[
[
[-118.2, 34],
[-118.3, 34],
[-118.3, 34.10],
[-118.2, 34.10],
[-118.2, 34]
]
],
[
[
[-118.5, 33.75],
[-118, 33.75],
[-118, 34.25],
[-118.5, 34.25],
[-118.5, 33.75]
],
[
[-118.1, 33.85],
[-118.4, 33.85],
[-118.4, 34.15],
[-118.1, 34.15],
[-118.1, 33.85]
]
]
]
}
////////////////////////////////////////////////////////////////////////////////////////////
//Leaflet layers and controls//
////////////////////////////////////////////////////////////////////////////////////////////
var polyLayer =...