Made MapWidget a JS class.
@@ -36,10 +36,8 @@ function GeometryTypeControl(opt_options) {
ol.inherits(GeometryTypeControl, ol.control.Control);
// TODO: allow deleting individual features (#8972)
-{
- const jsonFormat = new ol.format.GeoJSON();
-
- function MapWidget(options) {
+class MapWidget {
+ constructor(options) {
this.map = null;
this.interactions = {draw: null, modify: null};
this.typeChoices = false;
@@ -92,6 +90,7 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
const initial_value = document.getElementById(this.options.id).value;
if (initial_value) {
+ const jsonFormat = new ol.format.GeoJSON();
const features = jsonFormat.readFeatures('{"type": "Feature", "geometry": ' + initial_value + '}');
const extent = ol.extent.createEmpty();
features.forEach(function(feature) {
@@ -117,18 +116,17 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
this.ready = true;
}
- MapWidget.prototype.createMap = function() {
- const map = new ol.Map({
+ createMap() {
+ return new ol.Map({
target: this.options.map_id,
layers: [this.options.base_layer],
view: new ol.View({
zoom: this.options.default_zoom
})
});
- return map;
- };
+ }
- MapWidget.prototype.createInteractions = function() {
+ createInteractions() {
// Initialize the modify interaction
this.interactions.modify = new ol.interaction.Modify({
features: this.featureCollection,
@@ -156,17 +154,17 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
this.map.addInteraction(this.interactions.draw);
this.map.addInteraction(this.interactions.modify);
- };
+ }
- MapWidget.prototype.defaultCenter = function() {
+ defaultCenter() {
const center = [this.options.default_lon, this.options.default_lat];
if (this.options.map_srid) {
return ol.proj.transform(center, 'EPSG:4326', this.map.getView().getProjection());
}
return center;
- };
+ }
- MapWidget.prototype.enableDrawing = function() {
+ enableDrawing() {
this.interactions.draw.setActive(true);
if (this.typeChoices) {
// Show geometry type icons
@@ -175,9 +173,9 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
divs[i].style.visibility = "visible";
}
}
- };
+ }
- MapWidget.prototype.disableDrawing = function() {
+ disableDrawing() {
if (this.interactions.draw) {
this.interactions.draw.setActive(false);
if (this.typeChoices) {
@@ -188,16 +186,16 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
}
}
}
- };
+ }
- MapWidget.prototype.clearFeatures = function() {
+ clearFeatures() {
this.featureCollection.clear();
// Empty textarea widget
document.getElementById(this.options.id).value = '';
this.enableDrawing();
- };
+ }
- MapWidget.prototype.serializeFeatures = function() {
+ serializeFeatures() {
// Three use cases: GeometryCollection, multigeometries, and single geometry
let geometry = null;
const features = this.featureOverlay.getSource().getFeatures();
@@ -228,8 +226,7 @@ ol.inherits(GeometryTypeControl, ol.control.Control);
geometry = features[0].getGeometry();
}
}
+ const jsonFormat = new ol.format.GeoJSON();
document.getElementById(this.options.id).value = jsonFormat.writeGeometry(geometry);
- };
-
- window.MapWidget = MapWidget;
+ }
}
