Merge branch 'master' of github.com:CloudMade/Leaflet

This commit is contained in:
mourner 2012-02-23 10:32:59 +02:00
commit fd90a94f31
10 changed files with 115 additions and 19 deletions

View File

@ -7,16 +7,18 @@ Leaflet Changelog
An in-progress version being developed on the master branch.
### Major features
### Notable new features
* Added **polyline and polygon editing**. [#174](https://github.com/CloudMade/Leaflet/issues/174)
* Added `DivIcon` class that easily allows you to create lightweight div-based markers.
* Added `Rectangle` vector layer (by [@JasonSanford](https://github.com/JasonSanford)). [#504](https://github.com/CloudMade/Leaflet/pull/504)
### Improvements
#### Usabiliy improvements
* Drag-panning now works even when there are markers in the starting point (helps on maps with lots of markers). [#506](https://github.com/CloudMade/Leaflet/issues/506)
* Improved panning performance even more (there are no wasted frames now).
* Slightly improved default popup styling.
#### Breaking API changes
@ -33,6 +35,7 @@ An in-progress version being developed on the master branch.
* Added `Icon` `className` option to assign a custom class to an icon.
* Added `Icon` `shadowOffset` option to set the position of shadow relative to the icon.
* Made all `Icon` options except `iconUrl` optional (if not specified, they'll be chosen automatically or implemented using CSS). Anchor is centered by default (if size is specified), and otherwise can be set through CSS using negative margins.
* Added `originalEvent` property to `MouseEvent` (by [@k4](https://github.com/k4)). [#521](https://github.com/CloudMade/Leaflet/pull/521)
* Added `Circle` `getBounds` method. [#440](https://github.com/CloudMade/Leaflet/issues/440)
* Added `Marker` `opacity` option.
* Added public `redraw` method to vector layers (useful if you manipulate their `LatLng` points directly).

View File

@ -76,6 +76,7 @@
'layer/vector/Polyline.Edit.js',
'layer/vector/canvas/Polyline.Canvas.js',
'layer/vector/Polygon.js',
'layer/vector/Rectangle.js',
'layer/vector/canvas/Polygon.Canvas.js',
'layer/vector/MultiPoly.js',
'layer/vector/Circle.js',

View File

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<title>Leaflet debug page</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="../../dist/leaflet.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="../../dist/leaflet.ie.css" /><![endif]-->
<script src="../leaflet-include.js"></script>
</head>
<body>
<div id="map" style="width: 500px; height: 500px;"></div>
<input type="button" value="Set blue rectangle bounds as current map extent." onclick="resetBounds();" />
<script type="text/javascript">
var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
cloudmadeAttribution = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution});;
var bounds = new L.LatLngBounds(new L.LatLng(54.559322, -5.767822), new L.LatLng(56.1210604, -3.021240));
var bounds2 = new L.LatLngBounds(new L.LatLng(56.2124322195806, -3.427734375), new L.LatLng(56.307776937156945, -3.2560729980468746));
var rectangle = new L.Rectangle(bounds);
var styledRectangle = new L.Rectangle(bounds2, {
fillColor: "#ff7800",
color: "#000000",
opacity: 1,
weight: 2
});
rectangle.on("click", function () {
alert("you clicked a rectangle.")
});
var map = new L.Map('map', {
center: bounds.getCenter(),
zoom: 7,
layers: [cloudmade]
});
map.addLayer(rectangle).addLayer(styledRectangle);
function resetBounds() {
rectangle.setBounds(map.getBounds());
}
</script>
</body>
</html>

View File

@ -1,4 +1,3 @@
L.Control.Zoom = L.Control.extend({
options: {
position: 'topleft'
@ -6,25 +5,23 @@ L.Control.Zoom = L.Control.extend({
onAdd: function (map) {
var className = 'leaflet-control-zoom',
container = L.DomUtil.create('div', className),
zoomInButton = this._createButton('Zoom in', className + '-in', map.zoomIn, map),
zoomOutButton = this._createButton('Zoom out', className + '-out', map.zoomOut, map);
container = L.DomUtil.create('div', className);
container.appendChild(zoomInButton);
container.appendChild(zoomOutButton);
this._createButton('Zoom in', className + '-in', container, map.zoomIn, map);
this._createButton('Zoom out', className + '-out', container, map.zoomOut, map);
return container;
},
_createButton: function (title, className, fn, context) {
var link = document.createElement('a');
_createButton: function (title, className, container, fn, context) {
var link = L.DomUtil.create('a', className, container);
link.href = '#';
link.title = title;
link.className = className;
L.DomEvent.addListener(link, 'click', L.DomEvent.stopPropagation);
L.DomEvent.addListener(link, 'click', L.DomEvent.preventDefault);
L.DomEvent.addListener(link, 'click', fn, context);
L.DomEvent
.addListener(link, 'click', L.DomEvent.stopPropagation)
.addListener(link, 'click', L.DomEvent.preventDefault)
.addListener(link, 'click', fn, context);
return link;
}

View File

@ -30,6 +30,9 @@ L.Util = {
};
}()),
// TODO refactor: remove repetition
requestAnimFrame: (function () {
function timeoutDefer(callback) {
window.setTimeout(callback, 1000 / 60);
@ -47,11 +50,24 @@ L.Util = {
if (immediate && requestFn === timeoutDefer) {
callback();
} else {
requestFn(callback, contextEl);
return requestFn.call(window, callback, contextEl);
}
};
}()),
cancelAnimFrame: (function () {
var requestFn = window.cancelAnimationFrame ||
window.webkitCancelRequestAnimationFrame ||
window.mozCancelRequestAnimationFrame ||
window.oCancelRequestAnimationFrame ||
window.msCancelRequestAnimationFrame ||
clearTimeout;
return function (handle) {
return requestFn.call(window, handle);
}
}()),
limitExecByInterval: function (fn, time, context) {
var lock, execOnUnlock, args;
function exec() {

View File

@ -9,7 +9,7 @@ L.DomEvent = {
key = '_leaflet_' + type + id;
if (obj[key]) {
return;
return this;
}
var handler = function (e) {

View File

@ -90,7 +90,8 @@ L.Draggable = L.Class.extend({
var newPoint = new L.Point(first.clientX, first.clientY);
this._newPos = this._startPos.add(newPoint).subtract(this._startPoint);
L.Util.requestAnimFrame(this._updatePosition, this, true, this._dragStartTarget);
L.Util.cancelAnimFrame(this._animRequest);
this._animRequest = L.Util.requestAnimFrame(this._updatePosition, this, true, this._dragStartTarget);
},
_updatePosition: function () {

View File

@ -106,7 +106,8 @@ L.Path = L.Path.extend({
this.fire(e.type, {
latlng: latlng,
layerPoint: layerPoint,
containerPoint: containerPoint
containerPoint: containerPoint,
originalEvent: e
});
L.DomEvent.stopPropagation(e);

View File

@ -0,0 +1,23 @@
/*
* L.Rectangle extends Polygon and creates a rectangle when passed at LatLngBounds
*/
L.Rectangle = L.Polygon.extend({
initialize: function (latLngBounds, options) {
L.Polygon.prototype.initialize.call(this, this._boundsToLatLngs(latLngBounds), options);
},
setBounds: function (latLngBounds) {
this.setLatLngs(this._boundsToLatLngs(latLngBounds));
},
_boundsToLatLngs: function (latLngBounds) {
return [
latLngBounds.getSouthWest(),
latLngBounds.getNorthWest(),
latLngBounds.getNorthEast(),
latLngBounds.getSouthEast(),
latLngBounds.getSouthWest()
];
}
});

View File

@ -597,7 +597,8 @@ L.Map = L.Class.extend({
this.fire(type, {
latlng: latlng,
layerPoint: layerPoint,
containerPoint: containerPoint
containerPoint: containerPoint,
originalEvent: e
});
},