054af09032
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.
147 lines
3.3 KiB
JavaScript
147 lines
3.3 KiB
JavaScript
import Feature from '../../../src/ol/Feature.js';
|
|
import Fill from '../../../src/ol/style/Fill.js';
|
|
import LineString from '../../../src/ol/geom/LineString.js';
|
|
import Map from '../../../src/ol/Map.js';
|
|
import Point from '../../../src/ol/geom/Point.js';
|
|
import Stroke from '../../../src/ol/style/Stroke.js';
|
|
import Style from '../../../src/ol/style/Style.js';
|
|
import Text from '../../../src/ol/style/Text.js';
|
|
import VectorLayer from '../../../src/ol/layer/Vector.js';
|
|
import VectorSource from '../../../src/ol/source/Vector.js';
|
|
import View from '../../../src/ol/View.js';
|
|
|
|
const nicePath = [
|
|
20,
|
|
33,
|
|
40,
|
|
31,
|
|
60,
|
|
30,
|
|
80,
|
|
31,
|
|
100,
|
|
33,
|
|
120,
|
|
37,
|
|
140,
|
|
39,
|
|
160,
|
|
40,
|
|
180,
|
|
39,
|
|
200,
|
|
37,
|
|
220,
|
|
33,
|
|
240,
|
|
31,
|
|
260,
|
|
30,
|
|
280,
|
|
31,
|
|
300,
|
|
33,
|
|
];
|
|
|
|
const vectorSource = new VectorSource();
|
|
const pointStyle = new Style({
|
|
text: new Text({
|
|
text: 'Point Label',
|
|
font: 'Ubuntu',
|
|
fill: new Fill({
|
|
color: 'red',
|
|
}),
|
|
stroke: new Stroke({
|
|
color: 'black',
|
|
}),
|
|
}),
|
|
});
|
|
const lineStyle = new Style({
|
|
stroke: new Stroke({color: 'blue'}),
|
|
text: new Text({
|
|
text: 'Line Label',
|
|
font: 'Ubuntu',
|
|
fill: new Fill({
|
|
color: 'red',
|
|
}),
|
|
stroke: new Stroke({
|
|
color: 'black',
|
|
}),
|
|
placement: 'line',
|
|
}),
|
|
});
|
|
|
|
const pointFeature1 = new Feature({
|
|
geometry: new Point([160, 100]),
|
|
});
|
|
pointFeature1.setStyle(pointStyle.clone());
|
|
pointFeature1.getStyle().getText().setText('POINT ONE');
|
|
vectorSource.addFeature(pointFeature1);
|
|
|
|
const pointFeature2 = new Feature({
|
|
geometry: new Point([170, 105]),
|
|
});
|
|
pointFeature2.setStyle(pointStyle.clone());
|
|
pointFeature2.getStyle().getText().setText('POINT TWO');
|
|
pointFeature2
|
|
.getStyle()
|
|
.getText()
|
|
.setFill(new Fill({color: 'green'}));
|
|
vectorSource.addFeature(pointFeature2);
|
|
|
|
const pointFeature3 = new Feature({
|
|
geometry: new Point([150, 95]),
|
|
});
|
|
pointFeature3.setStyle(pointStyle.clone());
|
|
pointFeature3.getStyle().getText().setText('POINT THREE');
|
|
pointFeature3
|
|
.getStyle()
|
|
.getText()
|
|
.setFill(new Fill({color: 'yellow'}));
|
|
vectorSource.addFeature(pointFeature3);
|
|
|
|
const lineString1 = new LineString(nicePath, 'XY');
|
|
const lineFeature1 = new Feature({geometry: lineString1});
|
|
lineFeature1.setStyle(lineStyle);
|
|
lineFeature1.getStyle().getText().setText('LINE ONE');
|
|
vectorSource.addFeature(lineFeature1);
|
|
|
|
const lineString2 = lineString1.clone();
|
|
lineString2.translate(10, 10);
|
|
const lineFeature2 = new Feature({geometry: lineString2});
|
|
lineFeature2.setStyle(lineStyle.clone());
|
|
lineFeature2.getStyle().getText().setText('LINE TWO');
|
|
lineFeature2
|
|
.getStyle()
|
|
.getText()
|
|
.setFill(new Fill({color: 'green'}));
|
|
vectorSource.addFeature(lineFeature2);
|
|
|
|
const lineString3 = lineString1.clone();
|
|
lineString3.translate(-10, 10);
|
|
const lineFeature3 = new Feature({geometry: lineString3});
|
|
lineFeature3.setStyle(lineStyle.clone());
|
|
lineFeature3.getStyle().getText().setText('LINE THREE');
|
|
lineFeature3
|
|
.getStyle()
|
|
.getText()
|
|
.setFill(new Fill({color: 'yellow'}));
|
|
vectorSource.addFeature(lineFeature3);
|
|
|
|
const map = new Map({
|
|
pixelRatio: 1,
|
|
layers: [
|
|
new VectorLayer({
|
|
source: vectorSource,
|
|
}),
|
|
],
|
|
target: 'map',
|
|
view: new View({
|
|
center: [0, 0],
|
|
resolution: 1,
|
|
}),
|
|
});
|
|
map.getView().fit(vectorSource.getExtent());
|
|
|
|
render({tolerance: 0.024});
|