Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Added currentpoly option #2

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Added currentpoly option #2

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
100 changes: 53 additions & 47 deletions polysnapper.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
/*
_
| |
_ __ ___ | |_ _ ___ _ __ __ _ _ __ _ __ ___ _ __
_
| |
_ __ ___ | |_ _ ___ _ __ __ _ _ __ _ __ ___ _ __
| '_ \ / _ \| | | | / __| '_ \ / _` | '_ \| '_ \ / _ \ '__|
| |_) | (_) | | |_| \__ \ | | | (_| | |_) | |_) | __/ |
| .__/ \___/|_|\__, |___/_| |_|\__,_| .__/| .__/ \___|_|
| | __/ | | | | |
|_| |___/ |_| |_|
| |_) | (_) | | |_| \__ \ | | | (_| | |_) | |_) | __/ |
| .__/ \___/|_|\__, |___/_| |_|\__,_| .__/| .__/ \___|_|
| | __/ | | | | |
|_| |___/ |_| |_|

@jordanarseno - MIT LICENSE

*/
*/

function PolySnapper(opts){
function PolySnapper(opts){

function extend(obj) {

Expand All @@ -38,40 +38,41 @@ function PolySnapper(opts){
function defined(obj, key){
return typeof obj[key] !== 'undefined'
}

var that = this;

this.keyDownListener = null;
this.keyUpListener = null;

this.drawing = false;
this.currentpoly = null;
this.polys = ( defined(opts, 'polygons') )? opts.polygons : [];

var _map = ( defined(opts, 'map') )? opts.map : null;
var _marker = ( defined(opts, 'marker') )? opts.marker : new google.maps.Marker();
var _marker = ( defined(opts, 'marker') )? opts.marker : new google.maps.Marker();
var _thresh = ( defined(opts, 'threshold') )? opts.threshold : 20;
var _key = ( defined(opts, 'key') )? opts.key : 'shift';
var _keyReq = ( defined(opts, 'keyRequired') )? opts.keyRequired : false;

var _onEnabled = ( defined(opts, 'onEnabled') )? opts.onEnabled : function(){};
var _onDisabled = ( defined(opts, 'onDisabled') )? opts.onDisabled : function(){};
var _onDisabled = ( defined(opts, 'onDisabled') )? opts.onDisabled : function(){};
var _onChange = ( defined(opts, 'onChange') )? opts.onChange : function(){};

var _polystyle = ( defined(opts, 'polystyle') )? (JSON.parse(JSON.stringify(opts.polystyle))) : {};
var _hidePOI = ( defined(opts, 'hidePOI') )? opts.hidePOI : false;

var _currentpoly = ( defined(opts, 'currentpoly') )? opts.currentpoly : false;

var _keyDown = false;

if( !_map ){
console.log("We need to know the map");
return;
}

var _mapDiv = document.getElementById( _map.getDiv().getAttribute('id') );

if( _hidePOI ){

_map.poi = function(state){

var styles = [
Expand All @@ -96,11 +97,11 @@ function PolySnapper(opts){
this.set("styles", (state)? {} : styles );

}

}

if( _keyReq ){

var keymap = {
'shift': 16,
'ctrl': 17
Expand All @@ -115,7 +116,7 @@ function PolySnapper(opts){
_keyDown = (e.which == which)? false : true;
});
}

return {
polygon: function(){
return that.currentpoly;
Expand All @@ -124,22 +125,27 @@ function PolySnapper(opts){
return that.drawing;
},
enable: function(){

that.drawing = true;

if( _hidePOI ) _map.poi(false);

var vertexMarker = _marker;
var snapable_polys = that.polys.filter( function(p){ return ( typeof p.snapable !== 'undefined' && p.snapable ) } );
var snapable_points = snapable_polys.map( function(p){ return p.getPath().getArray() } ).reduce(function(a,b){ return a.concat(b) }, []);
var last_closeby = null;

//the official Drawing Manager will not work!
_map.setOptions({draggableCursor:'crosshair'});

that.currentpoly = new google.maps.Polygon(
extend( _polystyle, {editable: true, map: _map})
);
if (!_currentpoly) {
that.currentpoly = new google.maps.Polygon(
extend( _polystyle, {editable: true, map: _map})
);
} else {
that.currentpoly = _currentpoly ;
// that.currentpoly['editable'] = true ;
}

that.currentpoly.addListener('rightclick', function(e){

Expand All @@ -150,12 +156,12 @@ function PolySnapper(opts){

});

//you can delete vertices in the current polygon by right clicking them
//you can delete vertices in the current polygon by right clicking them
_map.addListener("click", function(e){

// Because path is an MVCArray, we can simply append a new coordinate
// and it will automatically appear.
var ll = (last_closeby && (!_keyReq || _keyReq && _keyDown) )? last_closeby : e.latLng;
var ll = (last_closeby && (!_keyReq || _keyReq && _keyDown) )? last_closeby : e.latLng;
that.currentpoly.getPath().push(ll);
_onChange();

Expand All @@ -177,7 +183,7 @@ function PolySnapper(opts){
_onChange();
});
}());

//Same comments go for insert_at ...
(function insertAtRecurse(){
google.maps.event.addListenerOnce(currentpoly.getPath(), "insert_at", function(idx){
Expand All @@ -187,16 +193,16 @@ function PolySnapper(opts){
});
}());


/*
we cannot listen to move events on the gmap object.. because when we
drag existing points, or new ones, the mouse move events are suspended
instead, we must attach mousemove to the mapcanvas (jquery), and then
instead, we must attach mousemove to the mapcanvas (jquery), and then
convert x,y coordinates in the map canvas to lat lng points.
*/

_mapDiv.onmousemove = function(e){

bounds = _map.getBounds();
neLatlng = bounds.getNorthEast();
swLatlng = bounds.getSouthWest();
Expand All @@ -211,13 +217,13 @@ function PolySnapper(opts){
var ll = new google.maps.LatLng(lat, lng);

//find any of the existing polygon points are close to the mousepointer
var closeby = snapable_points.filter ( function(p){
return ( google.maps.geometry.spherical.computeDistanceBetween(ll, p) ) < _thresh
var closeby = snapable_points.filter ( function(p){
return ( google.maps.geometry.spherical.computeDistanceBetween(ll, p) ) < _thresh
})[0] || null;

/* we could just use:

if(closeby){
if(closeby){
vertexMarker.setOptions({
position: closeby,
map: map
Expand All @@ -232,7 +238,7 @@ function PolySnapper(opts){

*/

if(closeby && closeby != last_closeby){
if(closeby && closeby != last_closeby){
last_closeby = closeby;
vertexMarker.setPosition(closeby);
vertexMarker.setMap(_map);
Expand All @@ -244,18 +250,18 @@ function PolySnapper(opts){


};

//now execute the callback
_onEnabled();
},
disable: function(){

if(_hidePOI) _map.poi(true);

that.drawing = false;
_map.setOptions({draggableCursor:null});
that.currentpoly.setMap(null);

_mapDiv.onmousemove = null;

if(_keyReq){
Expand All @@ -269,7 +275,7 @@ function PolySnapper(opts){
_onDisabled();

}

}
}

}