polygon.js

/*
 * Developed by The Di Lab
 * www.the-di-lab.com
 * 22.06.2010
 */
function PolygonCreator(map) {
	this.map = map;
	this.pen = new Pen(this.map);
	var thisOjb = this;
	proj4.defs("EPSG:31467", "+proj=tmerc +lat_0=0 +lon_0=9 +k=1 +x_0=3500000 +y_0=0"
			+ " +ellps=bessel +datum=potsdam +units=m +no_defs"); // http://spatialreference.org/ref/epsg/31467/proj4js/
	this.event = google.maps.event.addListener(thisOjb.map, 'click', function(event) {
		thisOjb.pen.draw(event.latLng);
	});
	this.destroy = function() {
		this.pen.deleteMis();
		$('#dataPanel').empty();
		if (null != this.pen.polygon) {
			this.pen.polygon.remove();
		}
		google.maps.event.removeListener(this.event);
	}
}

function Pen(map) {
	this.map = map;
	this.listOfDots = new Array();
	this.polyline = null;
	this.polygon = null;
	this.currentDot = null;
	this.draw = function(latLng) {
		if (null != this.polygon) {
			alert('Click Reset to draw another');
		} else {
			if (this.currentDot != null && this.listOfDots.length > 1 && this.currentDot == this.listOfDots[0]) {
				this.drawPolygon(this.listOfDots);
				$('#dataPanel').empty();
				$('#dataPanel').append("WGS84 Coordinates<br/>");
				$('#dataPanel').append(this.getWGS84Data() + "<br/>\n");
				$('#dataPanel').append("GSK3 Coordinates<br/>");
				$('#dataPanel').append(this.getGSK3DataAndArea());
			} else {
				if (null != this.polyline) {
					this.polyline.remove();
				}
				var dot = new Dot(latLng, this.map, this);
				this.listOfDots.push(dot);
				if (this.listOfDots.length > 1) {
					this.polyline = new Line(this.listOfDots, this.map);
				}
			}
		}
	}
	this.drawPolygon = function(listOfDots, color, des, id) {
		this.polygon = new Polygon(listOfDots, this.map, this, color, des, id);
		this.deleteMis();
	}
	this.deleteMis = function() {
		$.each(this.listOfDots, function(index, value) {
			value.remove();
		});
		this.listOfDots.length = 0;
		if (null != this.polyline) {
			this.polyline.remove();
			this.polyline = null;
		}
	}
	this.cancel = function() {
		if (null != this.polygon) {
			(this.polygon.remove());
		}
		this.polygon = null;
		this.deleteMis();
	}
	this.setCurrentDot = function(dot) {
		this.currentDot = dot;
	}
	this.getListOfDots = function() {
		return this.listOfDots;
	}
	this.getWGS84Data = function() {
		if (this.polygon != null) {
			var data = "";
			var paths = this.polygon.getPlots();
			var xs = [];
			var ys = [];
			paths.getAt(0).forEach(function(value, index) {
				data += (value.toString() + "<br/>");
			});
			return data;
		} else {
			return null;
		}
	}

	this.getGSK3DataAndArea = function(referenceSystem) {
		if (this.polygon != null) {
			var data = "";
			var paths = this.polygon.getPlots();
			var fromProjection = proj4('EPSG:4326');
			var toProjection = proj4('EPSG:31467');
			var xs = [];
			var ys = [];
			paths.getAt(0).forEach(function(value, index) {
				var gk3_coords = proj4(fromProjection, toProjection, [ value.lng(), value.lat() ]);
				xs.push(gk3_coords[0] - 3500000);
				ys.push(gk3_coords[1] - 5000000);
				data += "(" + (gk3_coords.toString() + ")<br/>");
			});
			data += "<br/>\nArea : " + (Math.round(polygonArea(xs, ys) / 1000) / 10).toString() + " ha<br/>";
			return data;
		} else {
			return null;
		}
	}
}

function Dot(latLng, map, pen) {
	this.latLng = latLng;
	this.parent = pen;
	this.markerObj = new google.maps.Marker({
		position : this.latLng,
		// draggable: true,
		map : map
	});
	this.addListener = function() {
		var parent = this.parent;
		var thisMarker = this.markerObj;
		var thisDot = this;
		google.maps.event.addListener(thisMarker, 'click', function() {
			parent.setCurrentDot(thisDot);
			parent.draw(thisMarker.getPosition());
		});
	}
	this.addListener();
	this.getLatLng = function() {
		return this.latLng;
	}
	this.getMarkerObj = function() {
		return this.markerObj;
	}
	this.remove = function() {
		this.markerObj.setMap(null);
	}
}

function Line(listOfDots, map) {
	this.listOfDots = listOfDots;
	this.map = map;
	this.coords = new Array();
	this.polylineObj = null;
	if (this.listOfDots.length > 1) {
		var thisObj = this;
		$.each(this.listOfDots, function(index, value) {
			thisObj.coords.push(value.getLatLng());
		});
		this.polylineObj = new google.maps.Polyline({
			path : this.coords,
			strokeColor : "#FF0000",
			strokeOpacity : 1.0,
			strokeWeight : 2,
			map : this.map
		});
	}
	this.remove = function() {
		this.polylineObj.setMap(null);
	}
}

function Polygon(listOfDots, map, pen, color) {
	this.listOfDots = listOfDots;
	this.map = map;
	this.coords = new Array();
	this.parent = pen;
	this.des = 'Hello';
	var thisObj = this;
	$.each(this.listOfDots, function(index, value) {
		thisObj.coords.push(value.getLatLng());
	});
	this.polygonObj = new google.maps.Polygon({
		paths : this.coords,
		strokeColor : "#FF0000",
		strokeOpacity : 0.8,
		strokeWeight : 2,
		fillColor : "#FF0000",
		fillOpacity : 0.35,
		map : this.map
	});
	this.remove = function() {
		this.polygonObj.setMap(null);
	}
	this.getContent = function() {
		return this.des;
	}
	this.getPolygonObj = function() {
		return this.polygonObj;
	}
	this.getListOfDots = function() {
		return this.listOfDots;
	}
	this.getPlots = function() {
		return this.polygonObj.getPaths();
	}
	this.addListener = function() {
		var thisPolygon = this.polygonObj;
		google.maps.event.addListener(thisPolygon, 'rightclick', function(event) {
			return false;
		});
	}
	this.addListener();
}

function polygonArea(X, Y, numPoints) {
	area = 0; // Accumulates area in the loop
	j = X.length - 1; // The last vertex is the 'previous' one to the first

	for (i = 0; i < X.length; i++) {
		area = area + (X[j] + X[i]) * (Y[j] - Y[i]);
		j = i; // j is previous vertex to i
	}
	return Math.abs(area / 2);
}