diff --git a/build/deps.js b/build/deps.js index a96d82b2..c7bf692e 100644 --- a/build/deps.js +++ b/build/deps.js @@ -156,7 +156,10 @@ var deps = { 'layer/vector2/SVG.js', 'layer/vector2/Path.js', 'geometry/LineUtil.js', - 'layer/vector2/Polyline.js'], + 'layer/vector2/Polyline.js', + 'geometry/PolyUtil.js', + 'layer/vector2/Polygon.js' + ], desc: 'New vector layers implementation.' }, diff --git a/debug/vector/vector2.html b/debug/vector/vector2.html index caf85680..1a718b44 100644 --- a/debug/vector/vector2.html +++ b/debug/vector/vector2.html @@ -21,7 +21,9 @@ latlngs.push(new L.LatLng(route[i][0], route[i][1])); } - var path = new L.Polyline(latlngs); + var path = new L.Polygon([ + latlngs, + [[50.5, 30.5], [50.5, 40], [40, 40]]]); var map = new L.Map('map', {layers: [cloudmade]}); diff --git a/src/layer/vector2/Path.js b/src/layer/vector2/Path.js index 236dc7b2..c0e66ff3 100644 --- a/src/layer/vector2/Path.js +++ b/src/layer/vector2/Path.js @@ -24,8 +24,8 @@ L.Path = L.Layer.extend({ this._renderer = this._map.getRenderer(this.options.renderer); this._renderer._initPath(this); - this._projectLatlngs(); - this._updatePath(); + this._project(); + this._update(); this._renderer._addPath(this); }, @@ -36,29 +36,28 @@ L.Path = L.Layer.extend({ getEvents: function () { return { - viewreset: this._projectLatlngs, - moveend: this._updatePath + viewreset: this._project, + moveend: this._update }; }, redraw: function () { if (this._map) { - this._projectLatlngs(); - this._updatePath(); + this._project(); + this._update(); } return this; }, - _updatePath: function () { + _update: function () { if (!this._map) { return; } this._clipPoints(); this._simplifyPoints(); + this._updatePath(); + }, + _updatePath: function () { this._renderer._updatePoly(this); } }); - -L.polyline2 = function (latlngs, options) { - return new L.Polyline2(latlngs, options); -}; diff --git a/src/layer/vector2/Polygon.js b/src/layer/vector2/Polygon.js new file mode 100644 index 00000000..29f2023c --- /dev/null +++ b/src/layer/vector2/Polygon.js @@ -0,0 +1,63 @@ + +L.Polygon = L.Polyline.extend({ + + options: { + fill: true + }, + + addLatLng: function (latlng) { + // TODO with rings + }, + + spliceLatLngs: function () { + // TODO with rings + }, + + getBounds: function () { + var flat = this._latlngs[0] instanceof L.LatLng; + return flat ? new L.LatLngsBounds(this._latlngs) : this._latlngs[0]; + }, + + _convertLatLngs: function (latlngs) { + var target = [], + flat = !L.Util.isArray(latlngs[0]) || typeof latlngs[0][0] === 'number', + len = latlngs.length; + + for (var i = 0; i < len; i++) { + target[i] = flat ? + L.latLng(latlngs[i]) : + this._convertLatLngs(latlngs[i]); + } + + if (flat && len >= 2 && target[0].equals(target[len - 1])) { + target.pop(); + } + + return target; + }, + + _clipPoints: function () { + var points = this._originalPoints, + bounds = this._renderer._bounds, + parts = points[0] instanceof L.Point ? [points] : points; + + this._parts = []; + + if (this.options.noClip) { return; } + + for (var i = 0, len = parts.length; i < len; i++) { + var clipped = L.PolyUtil.clipPolygon(parts[i], bounds); + if (clipped.length) { + this._parts.push(clipped); + } + } + }, + + _updatePath: function () { + this._renderer._updatePoly(this, true); + } +}); + +L.polygon = function (latlngs, options) { + return new L.Polyline(latlngs, options); +}; diff --git a/src/layer/vector2/Polyline.js b/src/layer/vector2/Polyline.js index 28b86a6e..276d59dc 100644 --- a/src/layer/vector2/Polyline.js +++ b/src/layer/vector2/Polyline.js @@ -10,7 +10,6 @@ L.Polyline = L.Path.extend({ initialize: function (latlngs, options) { L.setOptions(this, options); - this._latlngs = this._convertLatLngs(latlngs); }, @@ -30,7 +29,7 @@ L.Polyline = L.Path.extend({ spliceLatLngs: function () { var removed = [].splice.apply(this._latlngs, arguments); - this._convertLatLngs(this._latlngs, true); + this._latlngs = this._convertLatLngs(this._latlngs); this.redraw(); return removed; }, @@ -41,22 +40,29 @@ L.Polyline = L.Path.extend({ return new L.LatLngBounds(this.getLatLngs()); }, - _convertLatLngs: function (latlngs, overwrite) { - var target = overwrite ? latlngs : []; + _convertLatLngs: function (latlngs) { + var result = []; for (var i = 0, len = latlngs.length; i < len; i++) { - if (L.Util.isArray(latlngs[i]) && typeof latlngs[i][0] !== 'number') { return; } - target[i] = L.latLng(latlngs[i]); + result[i] = L.latLng(latlngs[i]); } - return target; + return result; }, - _projectLatlngs: function () { - this._originalPoints = []; + _project: function () { + this._originalPoints = this._projectLatlngs(this._latlngs); + }, - for (var i = 0, len = this._latlngs.length; i < len; i++) { - this._originalPoints[i] = this._map.latLngToLayerPoint(this._latlngs[i]); + _projectLatlngs: function (latlngs) { + var result = [], + flat = latlngs[0] instanceof L.LatLng; + + for (var i = 0, len = latlngs.length; i < len; i++) { + result[i] = flat ? + this._map.latLngToLayerPoint(latlngs[i]) : + this._projectLatlngs(latlngs[i]); } + return result; }, _clipPoints: function () {