leaflet-js 0.6.beta4 → 0.7.0

data/lib/leaflet.draw/src/ext/GeometryUtil.js

@@ -0,0 +1,68 @@
+L.GeometryUtil = {
+	// Ported from the OpenLayers implementation. See https://github.com/openlayers/openlayers/blob/master/lib/OpenLayers/Geometry/LinearRing.js#L270
+	geodesicArea: function (latLngs) {
+		var pointsCount = latLngs.length,
+			area = 0.0,
+			d2r = L.LatLng.DEG_TO_RAD,
+			p1, p2;
+
+		if (pointsCount > 2) {
+			for (var i = 0; i < pointsCount; i++) {
+				p1 = latLngs[i];
+				p2 = latLngs[(i + 1) % pointsCount];
+				area += ((p2.lng - p1.lng) * d2r) *
+						(2 + Math.sin(p1.lat * d2r) + Math.sin(p2.lat * d2r));
+			}
+			area = area * 6378137.0 * 6378137.0 / 2.0;
+		}
+
+		return Math.abs(area);
+	},
+
+	readableArea: function (area, isMetric) {
+		var areaStr;
+
+		if (isMetric) {
+			if (area >= 10000) {
+				areaStr = (area * 0.0001).toFixed(2) + ' ha';
+			} else {
+				areaStr = area.toFixed(2) + ' m&sup2;';
+			}
+		} else {
+			area *= 0.836127; // Square yards in 1 meter
+
+			if (area >= 3097600) { //3097600 square yards in 1 square mile
+				areaStr = (area / 3097600).toFixed(2) + ' mi&sup2;';
+			} else if (area >= 4840) {//48040 square yards in 1 acre
+				areaStr = (area / 4840).toFixed(2) + ' acres';
+			} else {
+				areaStr = Math.ceil(area) + ' yd&sup2;';
+			}
+		}
+
+		return areaStr;
+	},
+
+	readableDistance: function (distance, isMetric) {
+		var distanceStr;
+
+		if (isMetric) {
+			// show metres when distance is < 1km, then show km
+			if (distance > 1000) {
+				distanceStr = (distance  / 1000).toFixed(2) + ' km';
+			} else {
+				distanceStr = Math.ceil(distance) + ' m';
+			}
+		} else {
+			distance *= 1.09361;
+
+			if (distance > 1760) {
+				distanceStr = (distance / 1760).toFixed(2) + ' miles';
+			} else {
+				distanceStr = Math.ceil(distance) + ' yd';
+			}
+		}
+
+		return distanceStr;
+	}
+};

data/lib/leaflet.draw/src/images/spritesheet.svg

@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="540px" height="60px" viewBox="0 0 540 60" enable-background="new 0 0 540 60" xml:space="preserve">
+<g>
+	<path fill="#464646" d="M18,36v6h6v-6H18z M22,40h-2v-2h2V40z"/>
+	<path fill="#464646" d="M36,18v6h6v-6H36z M40,22h-2v-2h2V22z"/>
+	<polygon fill="#464646" points="23.142,39.145 20.857,36.854 36.857,20.857 39.142,23.142 	"/>
+</g>
+<polygon fill="#464646" points="83.07,42 76,28.773 86.463,18 100,24.565 97.904,39.396 "/>
+<rect x="140" y="20" fill="#464646" width="20" height="20"/>
+<path fill="#464646" d="M221,30c0,6.078-4.926,11-11,11s-11-4.922-11-11c0-6.074,4.926-11,11-11S221,23.926,221,30z"/>
+<path fill="#464646" d="M270,19c-4.971,0-9,4.029-9,9c0,4.971,5.001,12,9,14c4.001-2,9-9.029,9-14C279,23.029,274.971,19,270,19z
+	 M270,31.5c-2.484,0-4.5-2.014-4.5-4.5c0-2.484,2.016-4.5,4.5-4.5c2.485,0,4.5,2.016,4.5,4.5C274.5,29.486,272.485,31.5,270,31.5z"
+	/>
+<g>
+	<path fill="#464646" d="M337,30.156v0.407v5.604c0,1.658-1.344,3-3,3h-10c-1.655,0-3-1.342-3-3v-10c0-1.657,1.345-3,3-3h6.345
+		l3.19-3.17H324c-3.313,0-6,2.687-6,6v10c0,3.313,2.687,6,6,6h10c3.314,0,6-2.687,6-6v-8.809L337,30.156"/>
+	<polygon fill="#464646" points="329.828,33.529 327,33.529 327,30.699 335.891,21.809 338.719,24.637 	"/>
+	
+		<rect x="338.697" y="17.826" transform="matrix(-0.707 -0.7072 0.7072 -0.707 567.5655 274.7729)" fill="#464646" width="4" height="4"/>
+</g>
+<g>
+	<path fill="#464646" d="M381,42h18V24h-18V42z M395,26h2v14h-2V26z M391,26h2v14h-2V26z M387,26h2v14h-2V26z M383,26h2v14h-2V26z"
+		/>
+	<path fill="#464646" d="M395,20v-2v-2h-10v2v2h-6v2h22v-2H395z M393,20h-6v-2h6V20z"/>
+</g>
+<g>
+	<path fill="#BBBBBB" d="M458,30.156v0.407v5.604c0,1.658-1.344,3-3,3h-10c-1.655,0-3-1.342-3-3v-10c0-1.657,1.345-3,3-3h6.345
+		l3.19-3.17H445c-3.313,0-6,2.687-6,6v10c0,3.313,2.687,6,6,6h10c3.314,0,6-2.687,6-6v-8.809L458,30.156"/>
+	<polygon fill="#BBBBBB" points="450.828,33.529 448,33.529 448,30.699 456.891,21.809 459.719,24.637 	"/>
+	
+		<rect x="459.697" y="17.826" transform="matrix(-0.707 -0.7072 0.7072 -0.707 774.118 360.3402)" fill="#BBBBBB" width="4" height="4"/>
+</g>
+<g>
+	<path fill="#BBBBBB" d="M501,42h18V24h-18V42z M515,26h2v14h-2V26z M511,26h2v14h-2V26z M507,26h2v14h-2V26z M503,26h2v14h-2V26z"
+		/>
+	<path fill="#BBBBBB" d="M515,20v-2v-2h-10v2v2h-6v2h22v-2H515z M513,20h-6v-2h6V20z"/>
+</g>
+</svg>

data/lib/leaflet.label/CHANGELOG.md

@@ -5,11 +5,43 @@ Leaflet.draw Changelog
 
 An in-progress version being developed on the master branch.
 
+### Plugin improvements
+
+ * Improved performance when setting label content.
+
+### Bug fixes
+
+ * Fixed issue where labels could appear blurry after zoom. 
+
+## 0.2.0 (August 20, 2013)
+
+### Plugin improvements
+
+ * Removed need to call `showLabel` when adding a static label to the map.
+ * Added support for changing the direction of the label in relation to the marker. Added auto mode that switches depending on which side of the screen you are on. (adapted from [@erictheise](https://github.com/erictheise) pull request) [#17](https://github.com/Leaflet/Leaflet.label/pull/17)
+ * Added `labelAnchor` option to `L.CircleMarker`.
+
+### Bug fixes
+
+ * Fix bug where map view hard reset did not update labels. (by [@dagjomar](https://github.com/dagjomar)). [#43](https://github.com/Leaflet/Leaflet.label/pull/43)
+ * Fix issue where non static labels would remain visible if the latlng of the marker changed.
+
+## 0.1.4 (August 20, 2013)
+
+### Bug fixes
+
+ * Fixed error in IE < 9 when trying to set the label z-index. (by [@arthur-e](https://github.com/arthur-e)). [#13](https://github.com/Leaflet/Leaflet.label/pull/25)
+ * Fixed an issue when removing the click handler from the container to close labels in touch devices.
+
+## 0.1.3 (May 02, 2013)
+
 ### Plugin improvements
 
  * Added method `L.Marker.setLabelNoHide()` to allow toggling of static marker labels. (inspired by [@kpwebb](https://github.com/kpwebb)). [#20](https://github.com/Leaflet/Leaflet.label/pull/20)
  * Non-static labels will now hide when map container is tapped on touch devices. (by [@snkashis](https://github.com/snkashis)). [#26](https://github.com/Leaflet/Leaflet.label/pull/26)
  * Added ability to set the opacity of the label along with the marker. (inspired by [@snkashis](https://github.com/snkashis)). [#20](https://github.com/Leaflet/Leaflet.label/pull/27)
+ * Added support for mouse event to L.Label.
+ * Added public getter to L.Marker to retrieve the label associated to a marker.
 
 ### Bug fixes
 

data/lib/leaflet.label/README.md

@@ -1,6 +1,8 @@
 Leaflet.label
 =============
 
+**NOTE: lastest Leaflet.label master requires Leaflet 0.7-dev**
+
 Leaflet.label is plugin for adding labels to markers & shapes on leaflet powered maps.
 
 Check out the [demo](http://leaflet.github.com/Leaflet.label/).
@@ -28,18 +30,33 @@ If you would prefer the label to be always visible set the ````noHide: true````
 ````js
 L.marker([-37.785, 175.263])
 	.bindLabel('A sweet static label!', { noHide: true })
-	.addTo(map)
-	.showLabel();
+	.addTo(map);
 ````
 
-*N.B.* if you call `showLabel()` before it is added to the map the label will not show.
-
 ##Options
 
 When you call ````bindLabel()```` you can pass in an options object. These options are:
 
  - **noHide**: doesn't attach event handler for showing/hiding the label on mouseover/out.
  - **className**: the css class to add to the label element
+ - **direction**: one of `left`|`right`(default)|`auto`. The direction the label displays in relation to the marker. `auto` will choose the optimal direction depending on the position of the marker.
+
+E.g. To create a static label that automatically positions the label
+
+````js
+var myIcon = L.icon({
+	iconUrl: 'my-icon.png',
+	iconSize: [20, 20],
+	iconAnchor: [10, 10],
+	labelAnchor: [6, 0] // as I want the label to appear 2px past the icon (10 + 2 - 6)
+});
+L.marker([-37.7772, 175.2606], {
+	icon: myIcon
+}).bindLabel('My label', {
+	noHide: true,
+	direction: 'auto'
+});
+````
 
 ##Positioning the label for custom icons
 

data/lib/leaflet.label/build/build.js

@@ -3,7 +3,7 @@ var fs = require('fs'),
     UglifyJS = require('uglify-js'),
 
     deps = require('./deps.js').deps,
-    hintrc = require('./hintrc.js').config;
+    hintrc = require('./hintrc.js');
 
 
 function lintFiles(files) {
@@ -13,7 +13,7 @@ function lintFiles(files) {
 
 	for (i = 0, len = files.length; i < len; i++) {
 
-		jshint.JSHINT(fs.readFileSync(files[i], 'utf8'), hintrc);
+		jshint.JSHINT(fs.readFileSync(files[i], 'utf8'), hintrc.config, hintrc.globals);
 		errors = jshint.JSHINT.errors;
 
 		for (j = 0, len2 = errors.length; j < len2; j++) {

data/lib/leaflet.label/build/deps.js

@@ -9,7 +9,9 @@ var deps = {
 	Label: {
 		src: [
 			'Label.js',
+			'BaseMarkerMethods.js',
 			'Marker.Label.js',
+			'CircleMarker.Label.js',
 			'Path.Label.js',
 			'Map.Label.js',
 			'FeatureGroup.Label.js'

data/lib/leaflet.label/build/hintrc.js

@@ -45,3 +45,7 @@ exports.config = {
 	"white": true,
 	"smarttabs": true
 };
+
+exports.globals = {
+	'L': false
+}

data/lib/leaflet.label/dist/leaflet.label-src.js

@@ -11,15 +11,28 @@
  * Leaflet.label assumes that you have already included the Leaflet library.
  */
 
-L.labelVersion = '0.1.2-dev';
+L.labelVersion = '0.2.1-dev';
+
+L.Label = L.Class.extend({
+
+	includes: L.Mixin.Events,
 
-L.Label = L.Popup.extend({
 	options: {
-		autoPan: false,
 		className: '',
-		closePopupOnClick: false,
+		clickable: false,
+		direction: 'right',
 		noHide: false,
-		offset: new L.Point(12, -15) // 6 (width of the label triangle) + 6 (padding)
+		offset: [12, -15], // 6 (width of the label triangle) + 6 (padding)
+		opacity: 1,
+		zoomAnimation: true
+	},
+
+	initialize: function (options, source) {
+		L.setOptions(this, options);
+
+		this._source = source;
+		this._animated = L.Browser.any3d && this.options.zoomAnimation;
+		this._isOpen = false;
 	},
 
 	onAdd: function (map) {
@@ -30,16 +43,18 @@ L.Label = L.Popup.extend({
 		if (!this._container) {
 			this._initLayout();
 		}
-		this._updateContent();
-
-		var animFade = map.options.fadeAnimation;
 
-		if (animFade) {
-			L.DomUtil.setOpacity(this._container, 0);
-		}
 		this._pane.appendChild(this._container);
 
-		map.on('viewreset', this._updatePosition, this);
+		this._initInteraction();
+
+		this._update();
+
+		this.setOpacity(this.options.opacity);
+
+		map
+			.on('moveend', this._onMoveEnd, this)
+			.on('viewreset', this._onViewReset, this);
 
 		if (this._animated) {
 			map.on('zoomanim', this._zoomAnimation, this);
@@ -48,39 +63,47 @@ L.Label = L.Popup.extend({
 		if (L.Browser.touch && !this.options.noHide) {
 			L.DomEvent.on(this._container, 'click', this.close, this);
 		}
-
-		this._update();
-
-		if (animFade) {
-			L.DomUtil.setOpacity(this._container, 1);
-		}
 	},
 
 	onRemove: function (map) {
 		this._pane.removeChild(this._container);
 
-		L.Util.falseFn(this._container.offsetWidth); // force reflow
-
 		map.off({
-			viewreset: this._updatePosition,
-			zoomanim: this._zoomAnimation
+			zoomanim: this._zoomAnimation,
+			moveend: this._onMoveEnd,
+			viewreset: this._onViewReset
 		}, this);
 
-		if (map.options.fadeAnimation) {
-			L.DomUtil.setOpacity(this._container, 0);
-		}
+		this._removeInteraction();
 
 		this._map = null;
 	},
 
+	setLatLng: function (latlng) {
+		this._latlng = L.latLng(latlng);
+		if (this._map) {
+			this._updatePosition();
+		}
+		return this;
+	},
+
+	setContent: function (content) {
+		// Backup previous content and store new content
+		this._previousContent = this._content;
+		this._content = content;
+
+		this._updateContent();
+
+		return this;
+	},
+
 	close: function () {
 		var map = this._map;
-		if (L.Browser.touch && !this.options.noHide) {
-			L.DomEvent.off(this._container, 'click', this.close);
-		}
 
 		if (map) {
-			map._label = null;
+			if (L.Browser.touch && !this.options.noHide) {
+				L.DomEvent.off(this._container, 'click', this.close);
+			}
 
 			map.removeLayer(this);
 		}
@@ -89,26 +112,47 @@ L.Label = L.Popup.extend({
 	updateZIndex: function (zIndex) {
 		this._zIndex = zIndex;
 
-		if (this._container) {
+		if (this._container && this._zIndex) {
 			this._container.style.zIndex = zIndex;
 		}
 	},
 
+	setOpacity: function (opacity) {
+		this.options.opacity = opacity;
+
+		if (this._container) {
+			L.DomUtil.setOpacity(this._container, opacity);
+		}
+	},
+
 	_initLayout: function () {
 		this._container = L.DomUtil.create('div', 'leaflet-label ' + this.options.className + ' leaflet-zoom-animated');
 		this.updateZIndex(this._zIndex);
 	},
 
+	_update: function () {
+		if (!this._map) { return; }
+
+		this._container.style.visibility = 'hidden';
+
+		this._updateContent();
+		this._updatePosition();
+
+		this._container.style.visibility = '';
+	},
+
 	_updateContent: function () {
-		if (!this._content) { return; }
+		if (!this._content || !this._map || this._prevContent === this._content) {
+			return;
+		}
 
 		if (typeof this._content === 'string') {
 			this._container.innerHTML = this._content;
-		}
-	},
 
-	_updateLayout: function () {
-		// Do nothing
+			this._prevContent = this._content;
+
+			this._labelWidth = this._container.offsetWidth;
+		}
 	},
 
 	_updatePosition: function () {
@@ -118,42 +162,120 @@ L.Label = L.Popup.extend({
 	},
 
 	_setPosition: function (pos) {
-		pos = pos.add(this.options.offset);
+		var map = this._map,
+			container = this._container,
+			centerPoint = map.latLngToContainerPoint(map.getCenter()),
+			labelPoint = map.layerPointToContainerPoint(pos),
+			direction = this.options.direction,
+			labelWidth = this._labelWidth,
+			offset = L.point(this.options.offset);
+
+		// position to the right (right or auto & needs to)
+		if (direction === 'right' || direction === 'auto' && labelPoint.x < centerPoint.x) {
+			L.DomUtil.addClass(container, 'leaflet-label-right');
+			L.DomUtil.removeClass(container, 'leaflet-label-left');
+
+			pos = pos.add(offset);
+		} else { // position to the left
+			L.DomUtil.addClass(container, 'leaflet-label-left');
+			L.DomUtil.removeClass(container, 'leaflet-label-right');
+
+			pos = pos.add(L.point(-offset.x - labelWidth, offset.y));
+		}
 
-		L.DomUtil.setPosition(this._container, pos);
+		L.DomUtil.setPosition(container, pos);
 	},
 
 	_zoomAnimation: function (opt) {
-		var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center);
+		var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center).round();
 
 		this._setPosition(pos);
-	}
-});
+	},
 
-// Add in an option to icon that is used to set where the label anchor is
-L.Icon.Default.mergeOptions({
-	labelAnchor: new L.Point(9, -20)
-});
+	_onMoveEnd: function () {
+		if (!this._animated || this.options.direction === 'auto') {
+			this._updatePosition();
+		}
+	},
 
-// Have to do this since Leaflet is loaded before this plugin and initializes
-// L.Marker.options.icon therefore missing our mixin above.
-L.Marker.mergeOptions({
-	icon: new L.Icon.Default()
+	_onViewReset: function (e) {
+		/* if map resets hard, we must update the label */
+		if (e && e.hard) {
+			this._update();
+		}
+	},
+
+	_initInteraction: function () {
+		if (!this.options.clickable) { return; }
+
+		var container = this._container,
+			events = ['dblclick', 'mousedown', 'mouseover', 'mouseout', 'contextmenu'];
+
+		L.DomUtil.addClass(container, 'leaflet-clickable');
+		L.DomEvent.on(container, 'click', this._onMouseClick, this);
+
+		for (var i = 0; i < events.length; i++) {
+			L.DomEvent.on(container, events[i], this._fireMouseEvent, this);
+		}
+	},
+
+	_removeInteraction: function () {
+		if (!this.options.clickable) { return; }
+
+		var container = this._container,
+			events = ['dblclick', 'mousedown', 'mouseover', 'mouseout', 'contextmenu'];
+
+		L.DomUtil.removeClass(container, 'leaflet-clickable');
+		L.DomEvent.off(container, 'click', this._onMouseClick, this);
+
+		for (var i = 0; i < events.length; i++) {
+			L.DomEvent.off(container, events[i], this._fireMouseEvent, this);
+		}
+	},
+
+	_onMouseClick: function (e) {
+		if (this.hasEventListeners(e.type)) {
+			L.DomEvent.stopPropagation(e);
+		}
+
+		this.fire(e.type, {
+			originalEvent: e
+		});
+	},
+
+	_fireMouseEvent: function (e) {
+		this.fire(e.type, {
+			originalEvent: e
+		});
+
+		// TODO proper custom event propagation
+		// this line will always be called if marker is in a FeatureGroup
+		if (e.type === 'contextmenu' && this.hasEventListeners(e.type)) {
+			L.DomEvent.preventDefault(e);
+		}
+		if (e.type !== 'mousedown') {
+			L.DomEvent.stopPropagation(e);
+		} else {
+			L.DomEvent.preventDefault(e);
+		}
+	}
 });
 
-L.Marker.include({
+
+// This object is a mixin for L.Marker and L.CircleMarker. We declare it here as both need to include the contents.
+L.BaseMarkerMethods = {
 	showLabel: function () {
-		if (this._label && this._map) {
-			this._label.setLatLng(this._latlng);
-			this._map.showLabel(this._label);
+		if (this.label && this._map) {
+			this.label.setLatLng(this._latlng);
+			this._map.showLabel(this.label);
 		}
 
 		return this;
 	},
 
 	hideLabel: function () {
-		if (this._label) {
-			this._label.close();
+		if (this.label) {
+			this.label.close();
 		}
 		return this;
 	},
@@ -175,7 +297,8 @@ L.Marker.include({
 	},
 
 	bindLabel: function (content, options) {
-		var anchor = L.point(this.options.icon.options.labelAnchor) || new L.Point(0, 0);
+		var labelAnchor = this.options.icon ? this.options.icon.options.labelAnchor : this.options.labelAnchor,
+			anchor = L.point(labelAnchor) || L.point(0, 0);
 
 		anchor = anchor.add(L.Label.prototype.options.offset);
 
@@ -187,29 +310,30 @@ L.Marker.include({
 
 		this._labelNoHide = options.noHide;
 
-		if (!this._label) {
+		if (!this.label) {
 			if (!this._labelNoHide) {
 				this._addLabelRevealHandlers();
 			}
 
 			this
 				.on('remove', this.hideLabel, this)
-				.on('move', this._moveLabel, this);
+				.on('move', this._moveLabel, this)
+				.on('add', this._onMarkerAdd, this);
 
 			this._hasLabelHandlers = true;
 		}
 
-		this._label = new L.Label(options, this)
+		this.label = new L.Label(options, this)
 			.setContent(content);
 
 		return this;
 	},
 
 	unbindLabel: function () {
-		if (this._label) {
+		if (this.label) {
 			this.hideLabel();
 
-			this._label = null;
+			this.label = null;
 
 			if (this._hasLabelHandlers) {
 				if (!this._labelNoHide) {
@@ -218,7 +342,8 @@ L.Marker.include({
 
 				this
 					.off('remove', this.hideLabel, this)
-					.off('move', this._moveLabel, this);
+					.off('move', this._moveLabel, this)
+					.off('add', this._onMarkerAdd, this);
 			}
 
 			this._hasLabelHandlers = false;
@@ -227,8 +352,18 @@ L.Marker.include({
 	},
 
 	updateLabelContent: function (content) {
-		if (this._label) {
-			this._label.setContent(content);
+		if (this.label) {
+			this.label.setContent(content);
+		}
+	},
+
+	getLabel: function () {
+		return this.label;
+	},
+
+	_onMarkerAdd: function () {
+		if (this._labelNoHide) {
+			this.showLabel();
 		}
 	},
 
@@ -245,9 +380,7 @@ L.Marker.include({
 	_removeLabelRevealHandlers: function () {
 		this
 			.off('mouseover', this.showLabel, this)
-			.off('mouseout', this.hideLabel, this)
-			.off('remove', this.hideLabel, this)
-			.off('move', this._moveLabel, this);
+			.off('mouseout', this.hideLabel, this);
 
 		if (L.Browser.touch) {
 			this.off('click', this.showLabel, this);
@@ -255,9 +388,23 @@ L.Marker.include({
 	},
 
 	_moveLabel: function (e) {
-		this._label.setLatLng(e.latlng);
-	},
+		this.label.setLatLng(e.latlng);
+	}
+};
 
+// Add in an option to icon that is used to set where the label anchor is
+L.Icon.Default.mergeOptions({
+	labelAnchor: new L.Point(9, -20)
+});
+
+// Have to do this since Leaflet is loaded before this plugin and initializes
+// L.Marker.options.icon therefore missing our mixin above.
+L.Marker.mergeOptions({
+	icon: new L.Icon.Default()
+});
+
+L.Marker.include(L.BaseMarkerMethods);
+L.Marker.include({
 	_originalUpdateZIndex: L.Marker.prototype._updateZIndex,
 
 	_updateZIndex: function (offset) {
@@ -265,19 +412,57 @@ L.Marker.include({
 
 		this._originalUpdateZIndex(offset);
 
-		if (this._label) {
-			this._label.updateZIndex(zIndex);
+		if (this.label) {
+			this.label.updateZIndex(zIndex);
+		}
+	},
+
+	_originalSetOpacity: L.Marker.prototype.setOpacity,
+
+	setOpacity: function (opacity, labelHasSemiTransparency) {
+		this.options.labelHasSemiTransparency = labelHasSemiTransparency;
+
+		this._originalSetOpacity(opacity);
+	},
+
+	_originalUpdateOpacity: L.Marker.prototype._updateOpacity,
+
+	_updateOpacity: function () {
+		var absoluteOpacity = this.options.opacity === 0 ? 0 : 1;
+
+		this._originalUpdateOpacity();
+
+		if (this.label) {
+			this.label.setOpacity(this.options.labelHasSemiTransparency ? this.options.opacity : absoluteOpacity);
+		}
+	},
+
+	_originalSetLatLng: L.Marker.prototype.setLatLng,
+
+	setLatLng: function (latlng) {
+		if (this.label && !this._labelNoHide) {
+			this.hideLabel();
 		}
+
+		return this._originalSetLatLng(latlng);
 	}
 });
 
+// Add in an option to icon that is used to set where the label anchor is
+L.CircleMarker.mergeOptions({
+	labelAnchor: new L.Point(0, 0)
+});
+
+
+L.CircleMarker.include(L.BaseMarkerMethods);
+
 L.Path.include({
 	bindLabel: function (content, options) {
-		if (!this._label || this._label.options !== options) {
-			this._label = new L.Label(options, this);
+		if (!this.label || this.label.options !== options) {
+			this.label = new L.Label(options, this);
 		}
 
-		this._label.setContent(content);
+		this.label.setContent(content);
 
 		if (!this._showLabelAdded) {
 			this
@@ -295,9 +480,9 @@ L.Path.include({
 	},
 
 	unbindLabel: function () {
-		if (this._label) {
+		if (this.label) {
 			this._hideLabel();
-			this._label = null;
+			this.label = null;
 			this._showLabelAdded = false;
 			this
 				.off('mouseover', this._showLabel, this)
@@ -308,29 +493,27 @@ L.Path.include({
 	},
 
 	updateLabelContent: function (content) {
-		if (this._label) {
-			this._label.setContent(content);
+		if (this.label) {
+			this.label.setContent(content);
 		}
 	},
 
 	_showLabel: function (e) {
-		this._label.setLatLng(e.latlng);
-		this._map.showLabel(this._label);
+		this.label.setLatLng(e.latlng);
+		this._map.showLabel(this.label);
 	},
 
 	_moveLabel: function (e) {
-		this._label.setLatLng(e.latlng);
+		this.label.setLatLng(e.latlng);
 	},
 
 	_hideLabel: function () {
-		this._label.close();
+		this.label.close();
 	}
 });
 
 L.Map.include({
 	showLabel: function (label) {
-		this._label = label;
-
 		return this.addLayer(label);
 	}
 });