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

Make code prettier

Browse Source 
This updates ESLint and our shared eslint-config-openlayers to use Prettier.  Most formatting changes were automatically applied with this:

    npm run lint -- --fix

A few manual changes were required:

 * In `examples/offscreen-canvas.js`, the `//eslint-disable-line` comment needed to be moved to the appropriate line to disable the error about the `'worker-loader!./offscreen-canvas.worker.js'` import.
 * In `examples/webpack/exapmle-builder.js`, spaces could not be added after a couple `function`s for some reason.  While editing this, I reworked `ExampleBuilder` to be a class.
 * In `src/ol/format/WMSGetFeatureInfo.js`, the `// @ts-ignore` comment needed to be moved down one line so it applied to the `parsersNS` argument.
This commit is contained in:
Tim Schaub
2020-04-06 12:25:12 -06:00
parent 53b48baf62
commit 054af09032
790 changed files with 46833 additions and 33765 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
examples/tracing.js
View File

@@ -1,28 +1,31 @@
import Map from '../src/ol/Map.js';
import View from '../src/ol/View.js';
import Draw from '../src/ol/interaction/Draw.js';
import Snap from '../src/ol/interaction/Snap.js';
import Style from '../src/ol/style/Style.js';
import Stroke from '../src/ol/style/Stroke.js';
import Feature from '../src/ol/Feature.js';
import Fill from '../src/ol/style/Fill.js';
import GeoJSON from '../src/ol/format/GeoJSON.js';
import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
import {OSM, Vector as VectorSource} from '../src/ol/source.js';
import LineString from '../src/ol/geom/LineString.js';
import Feature from '../src/ol/Feature.js';
import Map from '../src/ol/Map.js';
import Snap from '../src/ol/interaction/Snap.js';
import Stroke from '../src/ol/style/Stroke.js';
import Style from '../src/ol/style/Style.js';
import View from '../src/ol/View.js';
import {OSM, Vector as VectorSource} from '../src/ol/source.js';
import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
// math utilities
// coordinates; will return the length of the [a, b] segment
function length(a, b) {
return Math.sqrt((b[0] - a[0]) * (b[0] - a[0]) + (b[1] - a[1]) * (b[1] - a[1]));
return Math.sqrt(
(b[0] - a[0]) * (b[0] - a[0]) + (b[1] - a[1]) * (b[1] - a[1])
);
}
// coordinates; will return true if c is on the [a, b] segment
function isOnSegment(c, a, b) {
const lengthAc = length(a, c);
const lengthAb = length(a, b);
const dot = ((c[0] - a[0]) * (b[0] - a[0]) + (c[1] - a[1]) * (b[1] - a[1])) / lengthAb;
const dot =
((c[0] - a[0]) * (b[0] - a[0]) + (c[1] - a[1]) * (b[1] - a[1])) / lengthAb;
return Math.abs(lengthAc - dot) < 1e-6 && lengthAc < lengthAb;
}
@@ -41,7 +44,10 @@ function getPartialRingCoords(feature, startPoint, endPoint) {
}
const ringCoords = polygon.getLinearRing().getCoordinates();
let i, pointA, pointB, startSegmentIndex = -1;
let i,
pointA,
pointB,
startSegmentIndex = -1;
for (i = 0; i < ringCoords.length; i++) {
pointA = ringCoords[i];
pointB = ringCoords[mod(i + 1, ringCoords.length)];
@@ -60,7 +66,10 @@ function getPartialRingCoords(feature, startPoint, endPoint) {
// build clockwise coordinates
for (i = 0; i < ringCoords.length; i++) {
pointA = i === 0 ? startPoint : ringCoords[mod(i + startSegmentIndex, ringCoords.length)];
pointA =
i === 0
? startPoint
: ringCoords[mod(i + startSegmentIndex, ringCoords.length)];
pointB = ringCoords[mod(i + startSegmentIndex + 1, ringCoords.length)];
cwCoordinates.push(pointA);
@@ -76,7 +85,10 @@ function getPartialRingCoords(feature, startPoint, endPoint) {
// build counter-clockwise coordinates
for (i = 0; i < ringCoords.length; i++) {
pointA = ringCoords[mod(startSegmentIndex - i, ringCoords.length)];
pointB = i === 0 ? startPoint : ringCoords[mod(startSegmentIndex - i + 1, ringCoords.length)];
pointB =
i === 0
? startPoint
: ringCoords[mod(startSegmentIndex - i + 1, ringCoords.length)];
ccwCoordinates.push(pointB);
if (isOnSegment(endPoint, pointA, pointB)) {
@@ -92,19 +104,19 @@ function getPartialRingCoords(feature, startPoint, endPoint) {
return ccwLength < cwLength ? ccwCoordinates : cwCoordinates;
}
// layers definition
const raster = new TileLayer({
source: new OSM()
source: new OSM(),
});
// features in this layer will be snapped to
const baseVector = new VectorLayer({
source: new VectorSource({
format: new GeoJSON(),
url: 'https://ahocevar.com/geoserver/wfs?service=wfs&request=getfeature&typename=topp:states&cql_filter=STATE_NAME=\'Idaho\'&outputformat=application/json'
})
url:
"https://ahocevar.com/geoserver/wfs?service=wfs&request=getfeature&typename=topp:states&cql_filter=STATE_NAME='Idaho'&outputformat=application/json",
}),
});
// this is were the drawn features go
@@ -113,28 +125,28 @@ const drawVector = new VectorLayer({
style: new Style({
stroke: new Stroke({
color: 'rgba(100, 255, 0, 1)',
width: 2
width: 2,
}),
fill: new Fill({
color: 'rgba(100, 255, 0, 0.3)'
})
})
color: 'rgba(100, 255, 0, 0.3)',
}),
}),
});
// this line only appears when we're tracing a feature outer ring
const previewLine = new Feature({
geometry: new LineString([])
geometry: new LineString([]),
});
const previewVector = new VectorLayer({
source: new VectorSource({
features: [previewLine]
features: [previewLine],
}),
style: new Style({
stroke: new Stroke({
color: 'rgba(255, 0, 0, 1)',
width: 2
})
})
width: 2,
}),
}),
});
const map = new Map({
@@ -142,8 +154,8 @@ const map = new Map({
target: 'map',
view: new View({
center: [-12986427, 5678422],
zoom: 5
})
zoom: 5,
}),
});
let drawInteraction, tracingFeature, startPoint, endPoint;
@@ -153,7 +165,7 @@ const getFeatureOptions = {
hitTolerance: 10,
layerFilter: (layer) => {
return layer === baseVector;
}
},
};
// the click event is used to start/end tracing around a feature
@@ -176,7 +188,11 @@ map.on('click', (event) => {
// second click on the tracing feature: append the ring coordinates
if (feature === tracingFeature) {
endPoint = tracingFeature.getGeometry().getClosestPoint(coord);
const appendCoords = getPartialRingCoords(tracingFeature, startPoint, endPoint);
const appendCoords = getPartialRingCoords(
tracingFeature,
startPoint,
endPoint
);
drawInteraction.removeLastPoint();
drawInteraction.appendCoordinates(appendCoords);
tracingFeature = null;
@@ -213,14 +229,18 @@ map.on('pointermove', (event) => {
let previewCoords = [];
if (coord) {
endPoint = tracingFeature.getGeometry().getClosestPoint(coord);
previewCoords = getPartialRingCoords(tracingFeature, startPoint, endPoint);
previewCoords = getPartialRingCoords(
tracingFeature,
startPoint,
endPoint
);
}
previewLine.getGeometry().setCoordinates(previewCoords);
}
});
const snapInteraction = new Snap({
source: baseVector.getSource()
source: baseVector.getSource(),
});
const typeSelect = document.getElementById('type');
@@ -230,7 +250,7 @@ function addInteraction() {
if (value !== 'None') {
drawInteraction = new Draw({
source: drawVector.getSource(),
type: typeSelect.value
type: typeSelect.value,
});
drawInteraction.on('drawstart', () => {
drawing = true;
@@ -245,7 +265,7 @@ function addInteraction() {
}
}
typeSelect.onchange = function() {
typeSelect.onchange = function () {
map.removeInteraction(drawInteraction);
map.removeInteraction(snapInteraction);
addInteraction();