I want to add for my map measure tools. I added distance for line and square for polygon. Also i added erase for drawed element, but i can't to clear measureTooltip. First I try do it with Overlay.clear(), but it results, that my popup destroy too. Second, I try remove html element through class, but don't have any reaction. Then I try do it like popup.hide() window, but it's not effective. May be anybody have implemention for this task or you can modify my code.
lineDraw.on('drawstart', function(evt){ sketch = evt.feature; var tooltipCoord = evt.coordinate; listener = sketch.getGeometry().on('change', function(evt) { var geom = evt.target; var output; output = formatLength((geom)); tooltipCoord = geom.getLastCoordinate(); measureTooltipElement.innerHTML = output; measureTooltip.setPosition(tooltipCoord); }); }, this);lineDraw.on('drawend', function(evt){ measureTooltipElement.className = 'tooltip tooltip-static'; measureTooltip.setOffset([0, -7]); sketch = null; measureTooltipElement = null; createMeasureTooltip(); ol.Observable.unByKey(listener);}, this);***$("#drawLine").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(lineDraw);});$("#drawPoly").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(polyDraw);});$("#erase").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(erase); erase.getFeatures().on('change:length', function(e){ if(e.target.getArray().length !== 0) { drawLayer.getSource().removeFeature(e.target.item(0)); } }); return false;});***function clearCustomInteractions(){$("#bar").find('p').removeClass('active');map.removeInteraction(lineDraw);map.removeInteraction(polyDraw);}function createMeasureTooltip() {// if (measureTooltipElement) {// measureTooltipElement.parentNode.removeChild(measureTooltipElement);//}measureTooltipElement = document.createElement('div');measureTooltipElement.className = 'tooltip tooltip-measure';closer = document.createElement('a');closer.href= '#';closer.className = 'tooltip-closer tooltip-closer:after';$(".tooltip").append($(closer));measureTooltip = new ol.Overlay({element: measureTooltipElement,offset: [0, -15],positioning: 'bottom-center'});map.addOverlay(measureTooltip);}closer.onclick = function() {measureTooltip.style.display = 'none';closer.blur();return false;};
أكثر...
lineDraw.on('drawstart', function(evt){ sketch = evt.feature; var tooltipCoord = evt.coordinate; listener = sketch.getGeometry().on('change', function(evt) { var geom = evt.target; var output; output = formatLength((geom)); tooltipCoord = geom.getLastCoordinate(); measureTooltipElement.innerHTML = output; measureTooltip.setPosition(tooltipCoord); }); }, this);lineDraw.on('drawend', function(evt){ measureTooltipElement.className = 'tooltip tooltip-static'; measureTooltip.setOffset([0, -7]); sketch = null; measureTooltipElement = null; createMeasureTooltip(); ol.Observable.unByKey(listener);}, this);***$("#drawLine").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(lineDraw);});$("#drawPoly").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(polyDraw);});$("#erase").click(function() { clearCustomInteractions(); $(this).addClass('active'); map.addInteraction(erase); erase.getFeatures().on('change:length', function(e){ if(e.target.getArray().length !== 0) { drawLayer.getSource().removeFeature(e.target.item(0)); } }); return false;});***function clearCustomInteractions(){$("#bar").find('p').removeClass('active');map.removeInteraction(lineDraw);map.removeInteraction(polyDraw);}function createMeasureTooltip() {// if (measureTooltipElement) {// measureTooltipElement.parentNode.removeChild(measureTooltipElement);//}measureTooltipElement = document.createElement('div');measureTooltipElement.className = 'tooltip tooltip-measure';closer = document.createElement('a');closer.href= '#';closer.className = 'tooltip-closer tooltip-closer:after';$(".tooltip").append($(closer));measureTooltip = new ol.Overlay({element: measureTooltipElement,offset: [0, -15],positioning: 'bottom-center'});map.addOverlay(measureTooltip);}closer.onclick = function() {measureTooltip.style.display = 'none';closer.blur();return false;};
أكثر...