Draw.Polygon.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. /**
  2. * @class L.Draw.Polygon
  3. * @aka Draw.Polygon
  4. * @inherits L.Draw.Polyline
  5. */
  6. L.Draw.Polygon = L.Draw.Polyline.extend({
  7. statics: {
  8. TYPE: 'polygon'
  9. },
  10. Poly: L.Polygon,
  11. options: {
  12. showArea: false,
  13. shapeOptions: {
  14. stroke: true,
  15. color: '#3388ff',
  16. weight: 4,
  17. opacity: 0.5,
  18. fill: true,
  19. fillColor: null, //same as color by default
  20. fillOpacity: 0.2,
  21. clickable: true
  22. },
  23. metric: true // Whether to use the metric measurement system or imperial
  24. },
  25. // @method initialize(): void
  26. initialize: function (map, options) {
  27. L.Draw.Polyline.prototype.initialize.call(this, map, options);
  28. // Save the type so super can fire, need to do this as cannot do this.TYPE :(
  29. this.type = L.Draw.Polygon.TYPE;
  30. },
  31. _updateFinishHandler: function () {
  32. var markerCount = this._markers.length;
  33. // The first marker should have a click handler to close the polygon
  34. if (markerCount === 1) {
  35. this._markers[0].on('click', this._finishShape, this);
  36. }
  37. // Add and update the double click handler
  38. if (markerCount > 2) {
  39. this._markers[markerCount - 1].on('dblclick', this._finishShape, this);
  40. // Only need to remove handler if has been added before
  41. if (markerCount > 3) {
  42. this._markers[markerCount - 2].off('dblclick', this._finishShape, this);
  43. }
  44. }
  45. },
  46. _getTooltipText: function () {
  47. var text, subtext;
  48. if (this._markers.length === 0) {
  49. text = L.drawLocal.draw.handlers.polygon.tooltip.start;
  50. } else if (this._markers.length < 3) {
  51. text = L.drawLocal.draw.handlers.polygon.tooltip.cont;
  52. } else {
  53. text = L.drawLocal.draw.handlers.polygon.tooltip.end;
  54. subtext = this._getMeasurementString();
  55. }
  56. return {
  57. text: text,
  58. subtext: subtext
  59. };
  60. },
  61. _getMeasurementString: function () {
  62. var area = this._area;
  63. if (!area) {
  64. return null;
  65. }
  66. return L.GeometryUtil.readableArea(area, this.options.metric);
  67. },
  68. _shapeIsValid: function () {
  69. return this._markers.length >= 3;
  70. },
  71. _vertexChanged: function (latlng, added) {
  72. var latLngs;
  73. // Check to see if we should show the area
  74. if (!this.options.allowIntersection && this.options.showArea) {
  75. latLngs = this._poly.getLatLngs();
  76. this._area = L.GeometryUtil.geodesicArea(latLngs);
  77. }
  78. L.Draw.Polyline.prototype._vertexChanged.call(this, latlng, added);
  79. },
  80. _cleanUpShape: function () {
  81. var markerCount = this._markers.length;
  82. if (markerCount > 0) {
  83. this._markers[0].off('click', this._finishShape, this);
  84. if (markerCount > 2) {
  85. this._markers[markerCount - 1].off('dblclick', this._finishShape, this);
  86. }
  87. }
  88. }
  89. });