innov
/
django1
1
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

Made MapWidget a JS class.

This commit is contained in:
Claude Paroz 2022-08-01 09:33:08 +02:00 committed by GitHub
parent d38324edc8
commit 2aa6fb2121
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
django/contrib/gis/static/gis/js/OLMapWidget.js
View File

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