Interaktionsfehlerbehandlung per Drag & Drop in OpenLayers
Ich versuche, Fehler beim Ziehen und Ablegen von Interaktionen für GPX-Dateien in OpenLayers 6.4.3 zu behandeln, z. B. wenn die abgelegte Datei ein falsches Format hat.
Ich habe herausgefunden, dass es im Fall eines Analysefehlers jetzt eine Möglichkeit gibt, den Fehler zu erkennen und den Benutzer darüber zu informieren. Die einzige sichtbare Folge eines Fehlers ist dieser Fehler in der Konsole (jedoch nur für einige Browser), der offensichtlich vom XML-Parser stammt:
XML5619: Falsche Dokumentensyntax. Zeile: 1, Spalte 1
Ich habe versucht, das errorEreignis der Interaktion zu verknüpfen, aber es wird überhaupt nicht ausgelöst.
Hier ist der relevante Code:
var dragAndDropInteraction = new ol.interaction.DragAndDrop({
formatConstructors: [
ol.format.GPX
]
});
var map = new ol.Map({
interactions: ol.interaction.defaults().extend([dragAndDropInteraction]),
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 2
})
});
dragAndDropInteraction.on('addfeatures', function(event) {
var vectorSource = new ol.source.Vector({
features: event.features
});
map.addLayer(new ol.layer.Vector({
source: vectorSource,
style: styleFunction
}));
map.getView().fit(
vectorSource.getExtent(), {
constrainResolution: false,
padding: [20, 50, 20, 50]
});
});
Gibt es eine Möglichkeit, Analysefehler zu erkennen und den Benutzer darüber zu informieren?
Antworten
Die Interaktion ist für die Verarbeitung mehrerer Formate ausgelegt, und Fehler sind zu erwarten, bis ein funktionierendes Format gefunden wird. Einige Formate geben einen Fehler aus, wenn sie nicht abgefangen werden, während andere stillschweigend fehlschlagen. Wenn also kein Format funktioniert, welchen Fehler würde es zurückgeben? Für ein einzelnes Format, in dem Sie eine bestimmte Fehlerbehandlung benötigen, können Sie ganz einfach Ihr eigenes Drag & Drop hinzufügen
map.getViewport().addEventListener('dragover', function(event) {
event.preventDefault();
});
map.getViewport().addEventListener('drop', function(event) {
event.preventDefault();
const files = event.dataTransfer.files;
for (let i = 0, ii = files.length; i < ii; ++i) {
const reader = new FileReader();
reader.onload = function(e) {
const features = new ol.format.GPX().readFeatures(reader.result);
...
};
reader.readAsText(files.item(i));
}
});