@sswroom/sswr 1.6.21 → 1.6.22

package/Changelog

@@ -1,3 +1,13 @@
+1.6.22
+-Enhance map.MapControl Marker
+-Added map.MapControl.layerMoveMarker
+-Added map.MapControl.markerUpdateIcon
+-Added map.MapControl.markerShowPopup
+-Added map.MapControl.hidePopup
+-Added map.MapControl.sizeUpdated
+-Added cesium.parseColor
+-Enhance cesium and leaflet map
+
 1.6.21
 -Added data.dataURI2Blob
 -Added EasyPrint.toSVG

package/cesium.d.ts

@@ -3,6 +3,7 @@ import * as geometry from "./geometry";
 import * as kml from "./kml";
 import * as map from "./map";
 import * as math from "./math";
+import * as web from "./web";
 
 declare class KMLFeatureOptions
 {
@@ -18,10 +19,12 @@ export function fromCartesian3Array(viewer: Viewer, arr: Cartesian3[]): object[]
 export function fromPolygonGraphics(viewer: Viewer, pg: PolygonGraphics): geometry.Polygon;
 export function createFromKML(feature: kml.Feature | kml.KMLFile, options: KMLFeatureOptions): any;
 export function createFromGeometry(geom: geometry.Vector2D, options: map.GeometryOptions)
-
+export function parseColor(c: string): web.Color;
 export class CesiumMap extends map.MapControl
 {
 	constructor(divId: string);
+	getDiv(): HTMLDivElement;
+	sizeUpdated(): void;
 	createLayer(layer: map.LayerInfo, options?: map.LayerOptions): any;
 	createMarkerLayer(name: string, options?: map.LayerOptions): any;
 	createGeometryLayer(name: string, options?: map.LayerOptions): any;
@@ -40,11 +43,15 @@ export class CesiumMap extends map.MapControl
 	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
 	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
 
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
+	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): map.MarkerInfo;
+	layerAddMarker(markerLayer: any, marker: map.MarkerInfo): void;
+	layerRemoveMarker(markerLayer: any, marker: map.MarkerInfo): void;
 	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
+	layerMoveMarker(markerLayer: any, marker: MarkerInfo, mapPos: math.Coord2D): MarkerInfo;
+	markerUpdateIcon(markerLayer: any, marker: MarkerInfo, url: string): MarkerInfo;
+	markerIsOver(marker: map.MarkerInfo, scnPos: math.Coord2D): boolean;
+	markerShowPopup(marker: MarkerInfo, content: string, w?: number, h?: number): void;
+	hidePopup();
 
 	createGeometry(geom: geometry.Vector2D, options: map.GeometryOptions): any;
 	layerAddGeometry(geometryLayer: any, geom: any): void;

package/cesium.js

@@ -4,7 +4,14 @@ import * as kml from "./kml.js";
 import * as map from "./map.js";
 import * as math from "./math.js";
 import * as text from "./text.js";
+import * as web from "./web.js";
 
+/**
+ * @param {{ scene: { globe: { ellipsoid: any; }; }; camera: { pickEllipsoid: (arg0: any, arg1: any) => any; }; }} viewer
+ * @param {number} x
+ * @param {number} y
+ * @param {{ cartesianToCartographic: (arg0: any) => any; } | null} ellipsoid
+ */
 export function screenToLatLon(viewer, x, y, ellipsoid)
 {
 	let pos = new Cesium.Cartesian2(x, y);
@@ -258,6 +265,10 @@ export function createFromKML(feature, options)
 	}
 }
 
+/**
+ * @param {geometry.Vector2D} geom
+ * @param {map.GeometryOptions} options
+ */
 export function createFromGeometry(geom, options)
 {
 	if (geom instanceof geometry.Point)
@@ -278,12 +289,40 @@ export function createFromGeometry(geom, options)
 			position: Cesium.Cartesian3.fromDegrees(geom.coordinates[0], geom.coordinates[1]),
 			billboard: new Cesium.BillboardGraphics(opt)});
 	}
+	else if (geom instanceof geometry.LinearRing)
+	{
+		let opt = {};
+		opt.heightReference = Cesium.HeightReference.CLAMP_TO_GROUND;
+		opt.height = 0;
+		if (options.lineColor)
+		{
+			let c = parseColor(options.lineColor);
+			opt.outlineColor = new Cesium.Color(c.r, c.g, c.b, c.a);
+			opt.outline = true;
+		}
+		if (options.lineWidth)
+		{
+			opt.outlineWidth = options.lineWidth;
+			opt.outline = true;
+		}
+		if (options.fillColor)
+		{
+			let c = parseColor(options.fillColor);
+			if (options.fillOpacity)
+			{
+				c.a = options.fillOpacity;
+			}
+			opt.material = new Cesium.Color(c.r, c.g, c.b, c.a);
+		}
+		opt.hierarchy = {positions: toCartesian3Arr(geom.coordinates), holes: []};
+		return new Cesium.Entity({polygon: new Cesium.PolygonGraphics(opt)});
+	}
 	else if (geom instanceof geometry.LineString)
 	{
 		let opt = {};
 		if (options.lineColor)
 		{
-			let c = kml.toColor(options.lineColor);
+			let c = parseColor(options.lineColor);
 			opt.material = new Cesium.Color(c.r, c.g, c.b, c.a);
 		}
 		if (options.lineWidth)
@@ -298,7 +337,7 @@ export function createFromGeometry(geom, options)
 		opt.height = 0;
 		if (options.lineColor)
 		{
-			let c = kml.toColor(options.lineColor);
+			let c = parseColor(options.lineColor);
 			opt.outlineColor = new Cesium.Color(c.r, c.g, c.b, c.a);
 			opt.outline = true;
 		}
@@ -309,7 +348,11 @@ export function createFromGeometry(geom, options)
 		}
 		if (options.fillColor)
 		{
-			let c = kml.toColor(options.fillColor);
+			let c = parseColor(options.fillColor);
+			if (options.fillOpacity)
+			{
+				c.a = options.fillOpacity;
+			}
 			opt.material = new Cesium.Color(c.r, c.g, c.b, c.a);
 		}
 		opt.hierarchy = {positions: toCartesian3Arr(geom.geometries[0].coordinates), holes: []};
@@ -331,7 +374,7 @@ export function createFromGeometry(geom, options)
 		let opt = {};
 		if (options.lineColor)
 		{
-			let c = kml.toColor(options.lineColor);
+			let c = parseColor(options.lineColor);
 			opt.outlineColor = new Cesium.Color(c.r, c.g, c.b, c.a);
 			opt.outline = true;
 		}
@@ -342,7 +385,11 @@ export function createFromGeometry(geom, options)
 		}
 		if (options.fillColor)
 		{
-			let c = kml.toColor(options.fillColor);
+			let c = parseColor(options.fillColor);
+			if (options.fillOpacity)
+			{
+				c.a = options.fillOpacity;
+			}
 			opt.material = new Cesium.Color(c.r, c.g, c.b, c.a);
 		}
 		console.log("MultiPolygon not supported", geom);
@@ -355,6 +402,19 @@ export function createFromGeometry(geom, options)
 	}
 }
 
+/**
+ * @param {string} c
+ */
+export function parseColor(c)
+{
+	let col = kml.toColor(c);
+	if (col == null)
+	{
+		col = web.parseCSSColor(c);
+	}
+	return col;
+}
+
 /*export function createPolygon(viewer, lats, lons, height)
 {
 	if (lats.length != lons.length)
@@ -386,6 +446,7 @@ export class CesiumMap extends map.MapControl
 	constructor(divId)
 	{
 		super();
+		this.mouseMove = null;
 		this.viewer = new Cesium.Viewer(divId, {
 			timeline:false,
 			animation:false,
@@ -395,8 +456,29 @@ export class CesiumMap extends map.MapControl
 //				url: "https://tile.openstreetmap.org/"
 //			  }))}
 		});
+		this.viewer.screenSpaceEventHandler.setInputAction((movement) => {
+			let pos = movement.startPosition;
+			let container = this.viewer.container;
+			if (pos.x >= 0 && pos.y >= 0 && pos.x < container.offsetWidth && pos.y < container.offsetHeight)
+			{
+				if (this.mouseMove)
+				{
+					this.mouseMove(this.scn2MapPos(new math.Coord2D(pos.x, pos.y)));
+				}
+			}
+		}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
 	};
 
+	getDiv()
+	{
+		return this.viewer.container;
+	}
+
+	sizeUpdated()
+	{
+
+	}
+
 	createLayer(layer, options)
 	{
 		if (layer.type == map.WebMapType.OSMTile)
@@ -411,8 +493,16 @@ export class CesiumMap extends map.MapControl
 		}
 	}
 
-	/*createMarkerLayer(name: string, options?: LayerOptions): any;
-	createGeometryLayer(name: string, options?: LayerOptions): any;*/
+	createMarkerLayer(name, options)
+	{
+		return [];
+	}
+
+	createGeometryLayer(name, options)
+	{
+		return [];
+	}
+
 	addLayer(layer)
 	{
 		if (layer instanceof Cesium.ImageryLayer)
@@ -481,22 +571,132 @@ export class CesiumMap extends map.MapControl
 		this.viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(center.x, center.y, xScale), duration:0});
 	}
 
-/*	handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;
-	handleMouseMove(moveFunc: (mapPos: math.Coord2D)=>void): void;
-	handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;
-	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
-	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
+/*	handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;*/
+	/**
+	 * @param {(mapPos: math.Coord2D)=>void} moveFunc
+	 */
+	handleMouseMove(moveFunc)
+	{
+		this.mouseMove = moveFunc;
+	}
+/*	handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;*/
+	/**
+	 * @param {math.Coord2D} mapPos
+	 */
+	map2ScnPos(mapPos)
+	{
+		let pos = Cesium.SceneTransforms.worldToDrawingBufferCoordinates(this.viewer.scene, Cesium.Cartesian3.fromDegrees(mapPos.x, mapPos.y));
+		if (pos)
+		{
+			return new math.Coord2D(pos.x, pos.y);
+		}
+		else
+		{
+			return new math.Coord2D(0, 0);
+		}
+	}
+
+	/**
+	 * @param {math.Coord2D} scnPos
+	 */
+	scn2MapPos(scnPos)
+	{
+		return screenToLatLon(this.viewer, scnPos.x, scnPos.y, null);
+	}
+
+	createMarker(mapPos, imgURL, imgWidth, imgHeight, options)
+	{
+		return new Cesium.Entity({position: Cesium.Cartesian3.fromDegrees(mapPos.x, mapPos.y), billboard: {image: imgURL, width: imgWidth, height: imgHeight}});
+	}
+
+	layerAddMarker(markerLayer, marker)
+	{
+		markerLayer.push(marker);
+		this.viewer.entities.add(marker);
+	}
+
+	layerRemoveMarker(markerLayer, marker)
+	{
+		markerLayer.remove(marker);
+		this.viewer.entities.remove(marker);
+	}
+
+	layerClearMarkers(markerLayer)
+	{
+		let geom;
+		while (geom = markerLayer.pop())
+		{
+			this.viewer.entities.remove(geom);
+		}
+	}
+
+	layerMoveMarker(markerLayer, marker, mapPos)
+	{
+		marker.position = Cesium.Cartesian3.fromDegrees(mapPos.x, mapPos.y);
+		return marker;
+	}
 
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
-	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
+	markerUpdateIcon(markerLayer, marker, url)
+	{
+		marker.billboard.image = url;
+		return marker;
+	}
+	
+	markerIsOver(marker, scnPos)
+	{
+		let latlng = marker.position.getValue();
+		let sz = [marker.billboard.width, marker.billboard.height];
+		let iconPos = Cesium.SceneTransforms.worldToDrawingBufferCoordinates(this.viewer.scene, latlng);
+		if (sz == null)
+			return false;
+		if ((scnPos.x < iconPos.x - sz[0] * 0.5) || (scnPos.y < iconPos.y - sz[1] * 0.5))
+			return false;
+		if ((iconPos.x + sz[0] * 0.5 <= scnPos.x) || (iconPos.y + sz[1] * 0.5 <= scnPos.y))
+			return false;
+		return true;
+	}
+
+	markerShowPopup(marker, content, w, h)
+	{
+		marker.description = {getValue: ()=>{return content;}};
+		this.viewer.selectedEntity = marker;
+	}
+
+	hidePopup()
+	{
+		this.viewer.selectedEntity = null;
+	}
+
+	/**
+	 * @param {geometry.Vector2D} geom
+	 * @param {map.GeometryOptions} options
+	 */
+	createGeometry(geom, options)
+	{
+		return createFromGeometry(geom, options);
+	}
+
+	layerAddGeometry(geometryLayer, geom)
+	{
+		geometryLayer.push(geom);
+		this.viewer.entities.add(geom);
+	}
+
+	layerRemoveGeometry(geometryLayer, geom)
+	{
+		geometryLayer.remove(geom);
+		this.viewer.entities.remove(geom);
+	}
+
+	layerClearGeometries(geometryLayer)
+	{
+		let geom;
+		while (geom = geometryLayer.pop())
+		{
+			this.viewer.entities.remove(geom);
+		}
+	}
 
-	createGeometry(geom: geometry.Vector2D, options: GeometryOptions): any;
-	layerAddGeometry(geometryLayer: any, geom: any): void;
-	layerRemoveGeometry(geometryLayer: any, geom: any): void;
-	layerClearGeometries(geometryLayer: any): void;*/
 	getViewer()
 	{
 		return this.viewer;

package/data.js

@@ -2305,7 +2305,7 @@ export class TimeInstant
 		if (typeof ticks == "number")
 		{
 			secs = Math.floor(ticks / 1000);
-			ms = (ticks - secs) * 1000;
+			ms = ticks - (secs * 1000);
 			secs = BigInt(secs);
 		}
 		else

package/dummy/olayer2.d.ts

@@ -2095,7 +2095,7 @@ export class Popup
 	 * @param closeBox  Whether to display a close box inside the popup.
 	 * @param closeBoxCallback  Function to be called on closeBox click.
 	 */
-	constructor(id: string, lonlat: LonLat, contentSize: Size|null, contentHTML: string, closeBox: boolean, closeBoxCallback: Function);
+	constructor(id: string, lonlat: LonLat, contentSize: Size|null, contentHTML: string, closeBox: boolean, closeBoxCallback?: Function);
 	/**
 	 * Auto size the popup so that it precisely fits its contents (as determined by this.contentDiv.innerHTML).  Popup size will, of course, be limited by the available space on the current map
 	 */

package/leaflet.d.ts

@@ -40,6 +40,8 @@ export class KMLNetworkLink
 export class LeafletMap extends map.MapControl
 {
 	constructor(divId: string);
+	getDiv(): HTMLDivElement;
+	sizeUpdated(): void;
 	createLayer(layer: map.LayerInfo, options?: map.LayerOptions): any;
 	createMarkerLayer(name: string, options?: map.LayerOptions): any;
 	createGeometryLayer(name: string, options?: map.LayerOptions): any;
@@ -58,11 +60,15 @@ export class LeafletMap extends map.MapControl
 	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
 	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
 
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
+	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): map.MarkerInfo;
+	layerAddMarker(markerLayer: any, marker: map.MarkerInfo): void;
+	layerRemoveMarker(markerLayer: any, marker: map.MarkerInfo): void;
 	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
+	layerMoveMarker(markerLayer: any, marker: MarkerInfo, mapPos: math.Coord2D): MarkerInfo;
+	markerUpdateIcon(markerLayer: any, marker: MarkerInfo, url: string): MarkerInfo;
+	markerIsOver(marker: map.MarkerInfo, scnPos: math.Coord2D): boolean;
+	markerShowPopup(marker: MarkerInfo, content: string, w?: number, h?: number): void;
+	hidePopup();
 
 	createGeometry(geom: geometry.Vector2D, options: map.GeometryOptions): any;
 	layerAddGeometry(geometryLayer: any, geom: any): void;

package/leaflet.js

@@ -540,10 +540,39 @@ export class KMLNetworkLink
 
 export class LeafletMap extends map.MapControl
 {
+	/**
+	 * @param {L.LeafletMouseEvent} evt
+	 */
+	onMouseMove(evt)
+	{
+		if (this.moveFunc)
+		{
+			this.moveFunc(fromLatLng(evt.latlng));
+		}
+	}
+
+	/**
+	 * @param {string | HTMLElement} divId
+	 */
 	constructor(divId)
 	{
 		super();
 		this.mapObj = L.map(divId);
+		this.moveFunc = null;
+		this.popupMarker = null;
+		let self = this;
+		this.mapObj.on("mousemove", (evt)=> {self.onMouseMove(evt);});
+	}
+
+	// @ts-ignore
+	getDiv()
+	{
+		return this.mapObj.getContainer();
+	}
+
+	sizeUpdated()
+	{
+		this.mapObj.invalidateSize();
 	}
 
 	createLayer(layer, options)
@@ -551,8 +580,15 @@ export class LeafletMap extends map.MapControl
 		return createLayer(layer, options);
 	}
 
-//	createMarkerLayer(name: string, options?: LayerOptions): any;
-//	createGeometryLayer(name: string, options?: LayerOptions): any;
+	createMarkerLayer(name, options)
+	{
+		return L.layerGroup();
+	}
+
+	createGeometryLayer(name, options)
+	{
+		return L.layerGroup();
+	}
 
 	addLayer(layer)
 	{
@@ -580,11 +616,18 @@ export class LeafletMap extends map.MapControl
 		this.mapObj.setZoom(osm.scale2Level(scale));
 	}
 
+	/**
+	 * @param {math.Coord2D} pos
+	 */
 	panTo(pos)
 	{
 		this.mapObj.setView(L.latLng(pos.y, pos.x));
 	}
 
+	/**
+	 * @param {math.Coord2D} pos
+	 * @param {number} scale
+	 */
 	panZoomScale(pos, scale)
 	{
 		this.mapObj.setView(L.latLng(pos.y, pos.x), osm.scale2Level(scale));
@@ -595,20 +638,219 @@ export class LeafletMap extends map.MapControl
 		this.mapObj.fitBounds(toLatLngBounds(extent));
 	}
 
-/*	handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;
-	handleMouseMove(moveFunc: (mapPos: math.Coord2D)=>void): void;
-	handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;
-	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
-	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
+/*	handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;*/
+	/**
+	 * @param {(mapPos: math.Coord2D)=>void} moveFunc
+	 */
+	handleMouseMove(moveFunc)
+	{
+		this.moveFunc = moveFunc;
+	}
+/*	handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;*/
+	/**
+	 * @param {math.Coord2D} mapPos
+	 */
+	map2ScnPos(mapPos)
+	{
+		let pt = this.mapObj.latLngToContainerPoint(L.latLng(mapPos.lat, mapPos.lon));
+		return new math.Coord2D(pt.x, pt.y);
+	}
+
+	scn2MapPos(scnPos)
+	{
+		let latlng = this.mapObj.containerPointToLatLng(L.point(scnPos.x, scnPos.y));
+		return new math.Coord2D(latlng.lng, latlng.lat);
+	}
+
+	/**
+	 * @param {math.Coord2D} mapPos
+	 * @param {string} imgURL
+	 * @param {number} imgWidth
+	 * @param {number} imgHeight
+	 * @param {map.MarkerOptions} options
+	 */
+	createMarker(mapPos, imgURL, imgWidth, imgHeight, options)
+	{
+		let icon = L.icon({iconUrl: imgURL, iconSize: [imgWidth, imgHeight]});
+		let opt = {icon: icon};
+		if (options.zIndex)
+		{
+			opt.zIndexOffset = options.zIndex;
+		}
+		return L.marker([mapPos.lat, mapPos.lon], opt);
+	}
+
+	layerAddMarker(markerLayer, marker)
+	{
+		marker.addTo(markerLayer);
+	}
+
+	layerRemoveMarker(markerLayer, marker)
+	{
+		markerLayer.removeLayer(marker);
+	}
+
+	layerClearMarkers(markerLayer)
+	{
+		markerLayer.clearLayers();
+	}
+
+	layerMoveMarker(markerLayer, marker, mapPos)
+	{
+		marker.setLatLng(L.latLng(mapPos.lat, mapPos.lon));
+		return marker;
+	}
+
+	markerUpdateIcon(markerLayer, marker, url)
+	{
+		let oldIcon = marker.getIcon();
+		marker.setIcon(L.icon({iconUrl: url, iconSize: oldIcon.options.iconSize}));
+		return marker;
+	}
+
+	markerIsOver(marker, scnPos)
+	{
+		let icon = marker.getIcon();
+		let latlng = marker.getLatLng();
+		let sz = icon.options.iconSize;
+		let iconPos = this.mapObj.latLngToContainerPoint(latlng);
+		if (sz == null)
+			return false;
+		if ((scnPos.x < iconPos.x - sz[0] * 0.5) || (scnPos.y < iconPos.y - sz[1] * 0.5))
+			return false;
+		if ((iconPos.x + sz[0] * 0.5 <= scnPos.x) || (iconPos.y + sz[1] * 0.5 <= scnPos.y))
+			return false;
+		return true;
+	}
+
+	markerShowPopup(marker, content, w, h)
+	{
+		let opt = {closeButton: false, closeOnEscapeKey: false};
+		if (w && h)
+		{
+			opt.minWidth = w;
+			opt.maxHeight = h;
+		}
+		marker.bindPopup(content, opt).openPopup();
+		this.popupMarker = marker;
+	}
+	
+	hidePopup()
+	{
+		if (this.popupMarker)
+		{
+			this.popupMarker.closePopup();
+			this.popupMarker = null;
+		}
+	}
+
+	/**
+	 * @param {geometry.Vector2D} geom
+	 * @param {map.GeometryOptions} options
+	 */
+	createGeometry(geom, options)
+	{
+		let opt = {};
+		if (options.lineColor)
+		{
+			opt.color = options.lineColor;
+			opt.stroke = true;
+			opt.weight = options.lineWidth || 1;
+		}
+		else
+		{
+			opt.stroke = false;
+		}
+		if (options.fillColor)
+		{
+			opt.fill = true;
+			opt.fillColor = options.fillColor;
+			opt.fillOpacity = options.fillOpacity;
+		}
+		else
+		{
+			opt.fill = false;
+		}
+		if (geom instanceof geometry.Point)
+		{
+//			return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(geom.coordinates[0], geom.coordinates[1]), null, opt);
+		}
+		else if (geom instanceof geometry.LinearRing)
+		{
+			let i;
+			let points = [];
+			for (i in geom.coordinates)
+			{
+				points.push([geom.coordinates[i][1], geom.coordinates[i][0]]);
+			}
+			return L.polygon(points, opt);
+		}
+		else if (geom instanceof geometry.LineString)
+		{
+			let i;
+			let points = [];
+			for (i in geom.coordinates)
+			{
+				points.push([geom.coordinates[i][1], geom.coordinates[i][0]]);
+			}
+			return L.polyline(points, opt);
+		}
+		else if (geom instanceof geometry.Polygon)
+		{
+			let i;
+			let j;
+			let lrArr = [];
+			for (i in geom.geometries)
+			{
+				let points = [];
+				let lr = geom.geometries[i];
+				for (j in lr.coordinates)
+				{
+					points.push([lr.coordinates[j][1], lr.coordinates[j][0]]);
+				}
+				lrArr.push(points);
+			}
+			return L.polygon(lrArr, opt);
+		}
+		else if (geom instanceof geometry.MultiPolygon)
+		{
+			let i;
+			let j;
+			let k;
+			let pgArr = [];
+			for (i in geom.geometries)
+			{
+				let lrArr = [];
+				let pg = geom.geometries[i];
+				for (j in pg.geometries)
+				{
+					let lr = pg.geometries[j];
+					let points = [];
+					for (k in lr.coordinates)
+					{
+						points.push([lr.coordinates[k][1], lr.coordinates[k][0]]);
+					}
+					lrArr.push(points);
+				}
+				pgArr.push(lrArr);
+			}
+			return L.polygon(pgArr, opt);
+		}
+		throw new Error("Unknown geometry type");
+	}
+
+	layerAddGeometry(geometryLayer, geom)
+	{
+		geom.addTo(geometryLayer);
+	}
 
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
-	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
+	layerRemoveGeometry(geometryLayer, geom)
+	{
+		geometryLayer.removeLayer(geom);
+	}
 
-	createGeometry(geom: geometry.Vector2D, options: GeometryOptions): any;
-	layerAddGeometry(geometryLayer: any, geom: any): void;
-	layerRemoveGeometry(geometryLayer: any, geom: any): void;
-	layerClearGeometries(geometryLayer: any): void;*/
+	layerClearGeometries(geometryLayer)
+	{
+		geometryLayer.clearLayers();
+	}
 }

package/map.d.ts

@@ -134,37 +134,47 @@ declare class GeometryOptions
 	fillOpacity?: number;
 }
 
-export class MapControl
+declare class MarkerInfo
+{
+}
+
+export abstract class MapControl
 {
 	constructor();
-	createLayer(layer: map.LayerInfo, options?: LayerOptions): any;
-	createMarkerLayer(name: string, options?: LayerOptions): any;
-	createGeometryLayer(name: string, options?: LayerOptions): any;
-	addLayer(layer: any): void;
-	addKMLFeature(feature: kml.Feature): void;
-	uninit(): void;
-	zoomIn(): void;
-	zoomOut(): void;
-	zoomScale(scale: number): void;
-	panTo(pos: math.Coord2D): void;
-	panZoomScale(pos: math.Coord2D, scale: number): void;
-	zoomToExtent(extent: math.RectArea): void;
-	handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;
-	handleMouseMove(moveFunc: (mapPos: math.Coord2D)=>void): void;
-	handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;
-	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
-	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
-
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
-	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
-
-	createGeometry(geom: geometry.Vector2D, options: GeometryOptions): any;
-	layerAddGeometry(geometryLayer: any, geom: any): void;
-	layerRemoveGeometry(geometryLayer: any, geom: any): void;
-	layerClearGeometries(geometryLayer: any): void;
+	abstract getDiv(): HTMLDivElement;
+	abstract sizeUpdated(): void;
+	abstract createLayer(layer: map.LayerInfo, options?: LayerOptions): any;
+	abstract createMarkerLayer(name: string, options?: LayerOptions): any;
+	abstract createGeometryLayer(name: string, options?: LayerOptions): any;
+	abstract addLayer(layer: any): void;
+	abstract addKML(feature: kml.Feature | kml.KMLFile): void;
+	abstract uninit(): void;
+	abstract zoomIn(): void;
+	abstract zoomOut(): void;
+	abstract zoomScale(scale: number): void;
+	abstract panTo(pos: math.Coord2D): void;
+	abstract panZoomScale(pos: math.Coord2D, scale: number): void;
+	abstract zoomToExtent(extent: math.RectArea): void;
+	abstract handleMouseLClick(clickFunc: (mapPos: math.Coord2D, scnPos: math.Coord2D)=>void): void;
+	abstract handleMouseMove(moveFunc: (mapPos: math.Coord2D)=>void): void;
+	abstract handlePosChange(posFunc: (mapPos: math.Coord2D)=>void): void;
+	abstract map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
+	abstract scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
+
+	abstract createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: MarkerOptions): MarkerInfo;
+	abstract layerAddMarker(markerLayer: any, marker: MarkerInfo): void;
+	abstract layerRemoveMarker(markerLayer: any, marker: MarkerInfo): void;
+	abstract layerClearMarkers(markerLayer: any): void;
+	abstract layerMoveMarker(markerLayer: any, marker: MarkerInfo, mapPos: math.Coord2D): MarkerInfo;
+	abstract markerUpdateIcon(markerLayer: any, marker: MarkerInfo, url: string): MarkerInfo;
+	abstract markerIsOver(marker: MarkerInfo, scnPos: math.Coord2D): boolean;
+	abstract markerShowPopup(marker: MarkerInfo, content: string, w?: number, h?: number): void;
+	abstract hidePopup();
+
+	abstract createGeometry(geom: geometry.Vector2D, options: GeometryOptions): any;
+	abstract layerAddGeometry(geometryLayer: any, geom: any): void;
+	abstract layerRemoveGeometry(geometryLayer: any, geom: any): void;
+	abstract layerClearGeometries(geometryLayer: any): void;
 }
 
 declare class OWSSpatialReference

package/olayer2.d.ts

@@ -29,6 +29,8 @@ export class Olayer2Map extends map.MapControl
 	posFunc: (lat: number, lon: number)=>void;
 
 	constructor(mapId: string);
+	getDiv(): HTMLDivElement;
+	sizeUpdated(): void;
 	createLayer(layer: map.LayerInfo, options?: map.LayerOptions): any;
 	createMarkerLayer(name: string, options?: map.LayerOptions): any;
 	createGeometryLayer(name: string, options?: map.LayerOptions): any;
@@ -47,11 +49,15 @@ export class Olayer2Map extends map.MapControl
 	map2ScnPos(mapPos: math.Coord2D): math.Coord2D;
 	scn2MapPos(scnPos: math.Coord2D): math.Coord2D;
 
-	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): any;
-	layerAddMarker(markerLayer: any, marker: any): void;
-	layerRemoveMarker(markerLayer: any, marker: any): void;
+	createMarker(mapPos: math.Coord2D, imgURL: string, imgWidth: number, imgHeight: number, options?: map.MarkerOptions): map.MarkerInfo;
+	layerAddMarker(markerLayer: any, marker: map.MarkerInfo): void;
+	layerRemoveMarker(markerLayer: any, marker: map.MarkerInfo): void;
 	layerClearMarkers(markerLayer: any): void;
-	markerIsOver(marker: any, scnPos: math.Coord2D): boolean;
+	layerMoveMarker(markerLayer: any, marker: MarkerInfo, mapPos: math.Coord2D): MarkerInfo;
+	markerUpdateIcon(markerLayer: any, marker: MarkerInfo, url: string): MarkerInfo;
+	markerIsOver(marker: map.MarkerInfo, scnPos: math.Coord2D): boolean;
+	markerShowPopup(marker: MarkerInfo, content: string, w?: number, h?: number): void;
+	hidePopup();
 
 	createGeometry(geom: geometry.Vector2D, options: map.GeometryOptions): any;
 	layerAddGeometry(geometryLayer: any, geom: any): void;

package/olayer2.js

@@ -235,6 +235,7 @@ export class Olayer2Map extends map.MapControl
 		this.initY = 22.4;
 		this.initLev = 12;
 		this.mapId = mapId;
+		this.currMarkerPopup = null;
 		let dom = document.getElementById(mapId);
 		if (dom)
 		{
@@ -288,6 +289,16 @@ export class Olayer2Map extends map.MapControl
 		this.currMarkerPopupObj = null;
 	}
 
+	getDiv()
+	{
+		return web.getDivElement(this.mapId);
+	}
+
+	sizeUpdated()
+	{
+		this.map.updateSize();
+	}
+
 	/**
 	 * @param {map.LayerInfo} layer
 	 * @param {object} options
@@ -374,6 +385,9 @@ export class Olayer2Map extends map.MapControl
 		}
 	}
 
+	/**
+	 * @param {kml.KMLFile | kml.Feature} feature
+	 */
 	addKML(feature)
 	{
 		createFromKML(feature, {map: this.map, objProjection: this.mapProjection, mapProjection: this.map.getProjectionObject()}).then((layer)=>{this.addLayer(layer);});
@@ -496,17 +510,82 @@ export class Olayer2Map extends map.MapControl
 		markerLayer.clearMarkers();
 	}
 
+	/**
+	 * @param {OpenLayers.Layer.Markers} markerLayer
+	 * @param {OpenLayers.Marker} marker
+	 * @param {math.Coord2D} mapPos
+	 */
+	layerMoveMarker(markerLayer, marker, mapPos)
+	{
+		let newIcon = new OpenLayers.Icon(marker.icon.url, marker.icon.size, marker.icon.offset);
+		if (marker.icon.imageDiv.style.zIndex)
+		{
+			newIcon.imageDiv.style.zIndex = marker.icon.imageDiv.style.zIndex;
+		}
+		let newMarker = new OpenLayers.Marker(new OpenLayers.LonLat(mapPos.x, mapPos.y).transform(this.mapProjection, this.map.getProjectionObject()), newIcon);
+		markerLayer.removeMarker(marker);
+		markerLayer.addMarker(newMarker);
+		marker.destroy();
+		return newMarker;
+	}
+
+	/**
+	 * @param {OpenLayers.Layer.Markers} markerLayer
+	 * @param {OpenLayers.Marker} marker
+	 * @param {string} url
+	 */
+	markerUpdateIcon(markerLayer, marker, url)
+	{
+		let newIcon = new OpenLayers.Icon(url, marker.icon.size, marker.icon.offset);
+		if (marker.icon.imageDiv.style.zIndex)
+		{
+			newIcon.imageDiv.style.zIndex = marker.icon.imageDiv.style.zIndex;
+		}
+		let newMarker = new OpenLayers.Marker(marker.lonlat, newIcon);
+		markerLayer.removeMarker(marker);
+		markerLayer.addMarker(newMarker);
+		marker.destroy();
+		return newMarker;
+	}
+	
 	markerIsOver(marker, scnPos)
 	{
 		let icon = marker.icon;
-		//alert("x="+x+", y="+y+", px.x="+icon.px.x+", px.y="+icon.px.y+", offset.x="+icon.offset.x+", offset.y="+icon.offset.y+", size.w="+icon.size.w+", size.h="+icon.size.h+", debug="+(icon.px.x + icon.px.offset.x + icon.size.w));
-		if ((scnPos.x < icon.px.x + icon.offset.x) || (scnPos.y < icon.px.y + icon.offset.y))
+		let ofst = marker.map.layerContainerOriginPx;
+		let ofstX = ofst.x + icon.offset.x;
+		let ofstY = ofst.y + icon.offset.y;
+		if (icon.px == null)
+			return false;
+		if ((scnPos.x < icon.px.x + ofstX) || (scnPos.y < icon.px.y + ofstY))
 			return false;
-		if ((icon.px.x + icon.offset.x + icon.size.w <= scnPos.x) || (icon.px.y + icon.offset.y + icon.size.h <= scnPos.y))
+		if ((icon.px.x + ofstX + icon.size.w <= scnPos.x) || (icon.px.y + ofstY + icon.size.h <= scnPos.y))
 			return false;
 		return true;
 	}
 
+	markerShowPopup(marker, content, w, h)
+	{
+		let popup = new OpenLayers.Popup("marker", marker.lonlat, new OpenLayers.Size(w, h), content, false);
+		if (this.currMarkerPopup)
+		{
+			this.currMarkerPopup.hide();
+		}
+		this.currMarkerPopup = popup;
+		popup.autoSize = true;
+		this.map.addPopup(popup);
+		popup.show();
+	}
+
+	hidePopup()
+	{
+		if (this.currMarkerPopup)
+		{
+			this.currMarkerPopup.hide();
+			this.map.removePopup(this.currMarkerPopup);
+			this.currMarkerPopup = null;
+		}
+	}
+	
 	/**
 	 * @param {geometry.Vector2D} geom
 	 * @param {map.GeometryOptions} options

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sswroom/sswr",
-  "version": "1.6.21",
+  "version": "1.6.22",
   "description": "Libraries made by sswroom",
   "main": "sswr.js",
   "scripts": {