// Copyright (c) 2022 Sebastian Panknin // Permission is hereby granted, free of charge, to any person obtaining a copy // of this software and associated documentation files (the "Software"), to deal // in the Software without restriction, including without limitation the rights // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell // copies of the Software, and to permit persons to whom the Software is // furnished to do so, subject to the following conditions: // The above copyright notice and this permission notice shall be included in all // copies or substantial portions of the Software. // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // SOFTWARE. define("map", ["openlayer", "htmlTools"], function(ol, h) { const mapSvgId = "mapSvg"; const markerRadius = 10; const textOffset = 5; const vectorSource = new ol.source.Vector({ features: [] }); let markerIcon; let markerFocusIcon; const highlightStyle = symbol => new ol.style.Style({ image: new ol.style.Icon({ scale: 0.05, color: "#ffa900", // "#0093c7", crossOrigin: 'anonymous', src: markerFocusIcon }), text: new ol.style.Text({ text: String(symbol), font: '10px Calibri,sans-serif', fill: new ol.style.Fill({ color: '#fff' }) }) }); const normalStyle = symbol => new ol.style.Style({ image: new ol.style.Icon({ scale: 0.15, color: "#bd1400", // "#00335b", crossOrigin: 'anonymous', src: markerIcon }), text: new ol.style.Text({ text: String(symbol), font: '10px Calibri,sans-serif', fill: new ol.style.Fill({ color: '#fff' }) }) }); const init = function(target, mapsrc, config) { markerIcon = config.pointerImage; markerFocusIcon = config.pointerFocusImage; ol.proj.useGeographic(); const vectorLayer = new ol.layer.Vector({ source: vectorSource }); const map = new ol.Map({ target: "map", layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }), vectorLayer ], view: new ol.View({ center: [config.center.long, config.center.lat], zoom: 18 }) }) }; const addMarker = function(long, lat, symbol, id) { const oldMarkers = vectorSource.getFeatures().filter(m => m.getId() === symbol) oldMarkers.forEach(m => vectorSource.removeFeature(m)) const marker = new ol.Feature({ geometry: new ol.geom.Point([long, lat]) }); marker.setId(id || symbol) marker.setStyle(normalStyle(symbol)); vectorSource.addFeature(marker) }; const clearMarker = function(){ const oldMarkers = vectorSource.getFeatures(); oldMarkers.forEach(m => vectorSource.removeFeature(m)); }; const setMarkers = function(data){ clearMarker(); data.forEach(d => { if (d.number) { d.positions.forEach((p, i) => addMarker(p.long, p.lat, d.number, d.number + "-" + i)); } }) }; const changeStyle = function(symbol, style) { const markers = vectorSource.getFeatures().filter(m => m.getId()?.match(symbol)) markers.forEach(m => m.setStyle(style)) }; return { init: init, addMarker: addMarker, setMarkers: setMarkers, clearMarker: clearMarker, highlight: symbol => changeStyle(symbol, highlightStyle(symbol)), fade: symbol => changeStyle(symbol, normalStyle(symbol)), vc: vectorSource }; });