diff --git a/index.html b/index.html index b6e7955..6f4b1fc 100644 --- a/index.html +++ b/index.html @@ -81,14 +81,40 @@ }) }); + var highlightStyle = new ol.style.Style({ + image: new ol.style.Circle({ + radius: 4, + fill: new ol.style.Fill({color: 'green'}) + }) + }); + + var defaultStyle = new ol.style.Style({ + image: new ol.style.Circle({ + radius: 4, + fill: new ol.style.Fill({color: 'red'}) + }) + }); + + var highlighted = []; + map.on("pointermove", e => { + var newhighlighted = []; + //gather overlay information var fids = []; map.forEachFeatureAtPixel(e.pixel, feature => { var fid = feature.getProperties().id; fids.push(fid); + feature.setStyle(highlightStyle); + newhighlighted.push(feature); }) + if(newhighlighted.length > 0) { + //remove highlight style + highlighted.filter(h => newhighlighted.indexOf(h) == -1).forEach(h => h.setStyle(defaultStyle)); + highlighted = newhighlighted; + } + // display information if(fids.length > 0) overlaytest.innerHTML = ""; @@ -118,19 +144,16 @@ } function addElement(data, features) { - //console.log(data); var elem = new Entry(data); - console.log(elem); var id = entryList.length; entryList.push(elem); var dot = ol.proj.fromLonLat(elem.loc); if(!isInit) { isInit = true; map.setView(new ol.View({center: dot, zoom: zoomstart})); - console.log(dot); + console.log(dot); //console.log(data); } - var feat = new ol.Feature({ geometry: new ol.geom.Point(dot), type: 'point', @@ -142,7 +165,6 @@ function loadedFile(text) { var lines = text.split("\n"); - console.group(); var features = []; for(var i = 1; i < lines.length; ++i) { var line = lines[i]; @@ -155,7 +177,6 @@ addElement(lineSplit, features); } - console.groupEnd(); updateMap(features); }