+++ /dev/null
-import * as SLDReader from '@nieuwlandgeo/sldreader';
-
-export default class LayerStyles {
- #sld;
-
-}
\ No newline at end of file
//
// ABSTRACT METHODS
//
-
- /** Zoom the map to the given value. */
- setZoom(zoom) {
- throw new Error("Abstract method");
- }
-
/** Set the center of the map to the given coordinates. */
setCenter(lng, lat) {
throw new Error("Abstract method");
}
- /** Add a single point. */
- addPoint(lng, lat, style) {
- throw new Error("Abstract method");
- }
-
- addUrlLayer(url, format) {
- throw new Error("Abstract method");
- }
-
//
// EXTENSIONS
//
*/
import { fromLonLat, getPointResolution } from 'ol/proj.js';
-import Feature from 'ol/Feature.js';
-import { Point } from 'ol/geom.js';
import { transformExtent } from 'ol/proj.js';
-import VectorLayer from 'ol/layer/Vector.js';
import TileLayer from 'ol/layer/Tile.js';
-import VectorSource from 'ol/source/Vector.js';
-import GeoJSON from 'ol/format/GeoJSON.js';
-import GPX from 'ol/format/GPX.js';
import OSM from 'ol/source/OSM.js';
import { isEmpty } from 'ol/extent';
import Select from 'ol/interaction/Select.js';
import Overlay from 'ol/Overlay.js';
-import { Style, Icon } from 'ol/style.js';
import Map from 'ol/Map.js';
-import View from 'ol/View.js';
+
import { OverviewMap, ScaleLine, defaults as defaultControls } from 'ol/control.js';
import { easeOut } from 'ol/easing';
/** The OpenLayers Map. */
#map;
+ /** The overview map */
#overviewMap;
- select;
-
/** Styled layer descriptor */
#sld;
+ /** The select interaction */
+ select;
+
/** Externally added callback functions. */
callbacks = {};
/* GEOGRAPHICAL METHODS */
- setZoom(zoom) {
- this.#map.getView().setZoom(zoom);
- }
-
setCenter(lat, lon) {
this.#map.getView().setCenter(fromLonLat([lon, lat]));
}
this.#map.getView().fit(transformed, options);
}
- addPoint(lng, lat, style) {
- let vectorSource = new VectorSource({
- features: [new Feature({
- geometry: new Point(fromLonLat([lng, lat]))
- })]
- });
- this.#map.addLayer(new VectorLayer({
- source: vectorSource,
- style: style,
- }));
- }
-
- addUrlLayer(url, format, style, sld) {
- let featureFormat;
- if (format === 'GEOJSON') {
- featureFormat = new GeoJSON();
- }
- else if (format === 'GPX') {
- featureFormat = new GPX();
- } else {
- throw new Error("Unsupported format " + format);
- }
- const vectorSource = new VectorSource({
- url: url,
- format: featureFormat,
- });
- const vectorLayer = new VectorLayer({
- source: vectorSource,
- });
- if (sld) {
- this.#applySLD(vectorLayer, style);
- } else if (style !== null) {
- vectorLayer.setStyle(style);
- }
- this.#map.addLayer(vectorLayer);
- }
-
- addLayer(js) {
- const func = new Function(js);
- const layer = (func)();
- this.#map.addLayer(layer);
- }
-
+ /** Accessors */
getMap() {
return this.#map;
}
});
}
- //
- // HTML
- //
- getMapDivCssClass() {
- return 'map';
- }
-
selectFeatures(layerName, featureIds) {
// we cannot use 'this' in the function provided to OpenLayers
let mapPart = this;
});
}
+ //
+ // HTML
+ //
+ getMapDivCssClass() {
+ return 'map';
+ }
+
+
//
// STATIC FOR EXTENSION
//
import VectorSource from 'ol/source/Vector.js';
import VectorLayer from 'ol/layer/Vector.js';
import GeoJSON from 'ol/format/GeoJSON.js';
+import { Style, Icon } from 'ol/style.js';
// PSEUDO PACKAGE
if (typeof globalThis.argeo === 'undefined')
globalThis.argeo.tp.ol.VectorSource = VectorSource;
globalThis.argeo.tp.ol.VectorLayer = VectorLayer;
globalThis.argeo.tp.ol.GeoJSON = GeoJSON;
+globalThis.argeo.tp.ol.Style = Style;
+globalThis.argeo.tp.ol.Icon = Icon;
"use strict";
+++ /dev/null
-package org.argeo.app.geo.ux;
-
-/** Known JavaScript implementations for this package. */
-public enum JsImplementation {
- OPENLAYERS_MAP_PART("argeo.app.geo.OpenLayersMapPart");
-
- private String jsClass;
-
- JsImplementation(String jsClass) {
- this.jsClass = jsClass;
- }
-
- public String getJsClass() {
- return jsClass;
- }
-}
/** An UX part displaying a map. */
public interface MapPart {
- /** A supported geographical data format. */
- enum GeoFormat {
- GEOJSON, GPX;
- }
-
- void addPoint(double lng, double lat, String style);
-
- void addUrlLayer(String url, GeoFormat format, String style);
-
- void setZoom(int zoom);
-
void setCenter(double lng, double lat);
/** Event when a feature has been single-clicked. */
import java.util.function.Consumer;
import java.util.function.Function;
-import org.argeo.app.geo.ux.MapPart.FeaturePopupEvent;
-import org.argeo.app.geo.ux.MapPart.FeatureSelectedEvent;
-import org.argeo.app.geo.ux.MapPart.FeatureSingleClickEvent;
import org.argeo.app.ol.AbstractOlObject;
import org.argeo.app.ol.Layer;
import org.argeo.app.ol.OlMap;
* A wrapper around an OpenLayers map, adding specific features, such as SLD
* styling.
*/
-public class OpenLayersMapPart extends AbstractGeoJsObject {
+public class OpenLayersMapPart extends AbstractGeoJsObject implements MapPart {
private final String mapPartName;
public OpenLayersMapPart(JsClient jsClient, String mapPartName) {
executeMethod(getMethodName(), JsClient.escapeQuotes(xml));
}
- public void setCenter(Double lat, Double lon) {
+ public void setCenter(double lat, double lon) {
executeMethod(getMethodName(), lat, lon);
}
+++ /dev/null
-package org.argeo.app.geo.swt;
-
-import java.util.function.Consumer;
-import java.util.function.Function;
-
-import org.argeo.app.geo.GeoUtils;
-import org.argeo.app.geo.ux.JsImplementation;
-import org.argeo.app.geo.ux.MapPart;
-import org.argeo.app.swt.js.SwtBrowserJsPart;
-import org.eclipse.swt.widgets.Composite;
-
-/**
- * An SWT implementation of {@link MapPart} based on JavaScript.
- */
-public class SwtJsMapPart extends SwtBrowserJsPart implements MapPart {
- static final long serialVersionUID = 2713128477504858552L;
-
- private String jsImplementation = JsImplementation.OPENLAYERS_MAP_PART.getJsClass();
- private final String mapName;// = "argeoMap";
-
- public SwtJsMapPart(String mapName, Composite parent, int style) {
- super(parent, style, "/pkg/org.argeo.app.js/geo.html");
- this.mapName = mapName;
- }
-
- @Override
- protected void init() {
- // create map
- doExecute(getJsMapVar() + " = new " + jsImplementation + "('" + mapName + "');");
- }
-
- /*
- * MapPart.js METHODS
- */
-
- @Override
- public void addPoint(double lng, double lat, String style) {
- executeMapMethod("addPoint(%f, %f, %s)", lng, lat, style == null ? "'default'" : style);
- }
-
- @Override
- public void addUrlLayer(String url, GeoFormat format, String style) {
- executeMapMethod("addUrlLayer('%s', '%s', %s, false)", url, format.name(), style);
- }
-
- public void addCssUrlLayer(String url, GeoFormat format, String css) {
- String style = GeoUtils.createSldFromCss("layer", "Layer", css);
- executeMapMethod("addUrlLayer('%s', '%s', '%s', true)", url, format.name(), style);
- }
-
- public void addLayer() {
- //executeMapMethod("addLayer(\"return new argeo.app.geo.TileLayer({source: new argeo.app.geo.OSM()})\")");
- executeMapMethod("getMap().addLayer(new argeo.tp.ol.TileLayer({source: new argeo.tp.ol.OSM()}))");
- }
-
- @Override
- public void setZoom(int zoom) {
- executeMapMethod("setZoom(%d)", zoom);
- }
-
- @Override
- public void setCenter(double lng, double lat) {
- executeMapMethod("setCenter(%f, %f)", lng, lat);
- }
-
- protected Object callMapMethod(String methodCall, Object... args) {
- return callMethod(getJsMapVar(), methodCall, args);
- }
-
- protected void executeMapMethod(String methodCall, Object... args) {
- executeMethod(getJsMapVar(), methodCall, args);
- }
-
- private String getJsMapVar() {
- return getJsVarName(mapName);
- }
-
- /*
- * CALLBACKS
- */
- public void onFeatureSelected(Consumer<FeatureSelectedEvent> toDo) {
- addCallback("FeatureSelected", (arr) -> {
- toDo.accept(new FeatureSelectedEvent((String) arr[0]));
- return null;
- });
- }
-
- public void onFeatureSingleClick(Consumer<FeatureSingleClickEvent> toDo) {
- addCallback("FeatureSingleClick", (arr) -> {
- toDo.accept(new FeatureSingleClickEvent((String) arr[0]));
- return null;
- });
- }
-
- public void onFeaturePopup(Function<FeaturePopupEvent, String> toDo) {
- addCallback("FeaturePopup", (arr) -> {
- return toDo.apply(new FeaturePopupEvent((String) arr[0]));
- });
- }
-
- protected void addCallback(String suffix, Function<Object[], Object> toDo) {
- getReadyStage().thenAccept((ready) -> {
- String functionName = createJsFunction(mapName + "__on" + suffix, toDo);
- doExecute(getJsMapVar() + ".callbacks['on" + suffix + "']=" + functionName + ";");
- executeMethod(mapName, "enable" + suffix + "()");
- });
- }
-}
+++ /dev/null
-<html lang="en">
-<script src="https://cdn.jsdelivr.net/npm/ol@v7.3.0/dist/ol.js"></script>
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@v7.3.0/ol.css"/>
- <style>
-
- .ol-popup {
- position: absolute;
- background-color: white;
- box-shadow: 0 1px 4px rgba(0,0,0,0.2);
- padding: 5px;
- border-radius: 10px;
- border: 1px solid #cccccc;
- bottom: 12px;
- left: -50px;
- min-width: 130px;
- }
- .ol-popup:after, .ol-popup:before {
- top: 100%;
- border: solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
- }
- .ol-popup:after {
- border-top-color: white;
- border-width: 10px;
- left: 48px;
- margin-left: -10px;
- }
- .ol-popup:before {
- border-top-color: #cccccc;
- border-width: 11px;
- left: 48px;
- margin-left: -11px;
- }
- .ol-popup-closer {
- text-decoration: none;
- position: absolute;
- top: 2px;
- right: 8px;
- }
- .ol-popup-closer:after {
- content: "✖";
- }
-
- #popup-content {
- font: 16px sans-serif;
- }
- </style></head>
-<body>
- <div id="map" class="map"></div>
-
- <div id="popup" class="ol-popup">
- <div id="popup-content"></div>
- </div>
-<script
- src="/pkg/org.argeo.app.geo.swt.openlayers/map.js"></script>
-</body>
-</html>
\ No newline at end of file