ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Display error message instead of 'style not valid yet...'

Browse Source
This commit is contained in:
Maximilian Krög
2019-10-03 16:57:20 +02:00
parent 8fe8302dc2
commit db49842f63
2 changed files with 31 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
examples/webgl-points-layer.js
View File

@@ -63,27 +63,26 @@ const map = new Map({
let literalStyle;
let pointsLayer;
function refreshLayer(newStyle) {
try {
const previousLayer = pointsLayer;
pointsLayer = new WebGLPointsLayer({
source: vectorSource,
style: newStyle
});
map.addLayer(pointsLayer);
const previousLayer = pointsLayer;
pointsLayer = new WebGLPointsLayer({
source: vectorSource,
style: newStyle
});
map.addLayer(pointsLayer);
if (previousLayer) {
map.removeLayer(previousLayer);
}
literalStyle = newStyle;
return true;
} catch (e) {
return false;
if (previousLayer) {
map.removeLayer(previousLayer);
}
literalStyle = newStyle;
}
function setStyleStatus(valid) {
document.getElementById('style-valid').style.display = valid === true ? 'initial' : 'none';
document.getElementById('style-invalid').style.display = valid === false ? 'initial' : 'none';
const spanValid = document.getElementById('style-valid');
const spanInvalid = document.getElementById('style-invalid');
function setStyleStatus(errorMsg) {
const isError = typeof errorMsg === 'string';
spanValid.style.display = errorMsg === null ? 'initial' : 'none';
spanInvalid.firstElementChild.innerText = isError ? errorMsg : '';
spanInvalid.style.display = isError ? 'initial' : 'none';
}
const editor = document.getElementById('style-editor');
@@ -91,10 +90,12 @@ editor.addEventListener('input', function() {
const textStyle = editor.value;
try {
const newLiteralStyle = JSON.parse(textStyle);
const same = JSON.stringify(newLiteralStyle) === JSON.stringify(literalStyle);
setStyleStatus(same || refreshLayer(newLiteralStyle));
if (JSON.stringify(newLiteralStyle) !== JSON.stringify(literalStyle)) {
refreshLayer(newLiteralStyle);
}
setStyleStatus(null);
} catch (e) {
setStyleStatus(false);
setStyleStatus(e.message);
}
});
@@ -103,8 +104,13 @@ select.value = 'circles';
function onSelectChange() {
const style = select.value;
const newLiteralStyle = predefinedStyles[style];
setStyleStatus(refreshLayer(newLiteralStyle) ? undefined : false);
editor.value = JSON.stringify(newLiteralStyle, null, 2);
try {
refreshLayer(newLiteralStyle);
setStyleStatus();
} catch (e) {
setStyleStatus(e.message);
}
}
onSelectChange();
select.addEventListener('change', onSelectChange);