gCubeSystem
/
geoportal-data-viewer-app
13
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

managed toggle button

This commit is contained in:
francesco 2020-10-28 11:19:12 +01:00
parent 41d90e8147
commit b414b21016
6 changed files with 420 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pom.xml
View File

@ -103,13 +103,11 @@
<version>2.3.2.0</version>
<scope>compile</scope>
</dependency>
<dependency>
<groupId>org.gcube.spatial.data</groupId>
<artifactId>geo-utility</artifactId>
<version>[1.0.0,2.0.0-SNAPSHOT)</version>
</dependency>
<dependency>
<groupId>org.gcube.common.portal</groupId>
<artifactId>portal-manager</artifactId>

85
src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/gis/OpenLayerOSM.java
View File

@ -4,6 +4,7 @@ import java.net.MalformedURLException;
import org.gcube.portlets.user.geoportaldataviewer.client.GeoportalDataViewerConstants;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.Event;
@ -20,6 +21,7 @@ import ol.View;
import ol.ViewOptions;
import ol.control.Attribution;
import ol.event.EventListener;
import ol.geom.Point;
import ol.interaction.Draw;
import ol.interaction.DrawOptions;
import ol.interaction.Extent;
@ -63,7 +65,9 @@ public class OpenLayerOSM {
private ProjectionOptions projectionOptions = OLFactory.createOptions();
/** The point draw. */
private Draw pointDraw;
private Draw queryPoint;
private Extent queryBox;
/** The popup overlay. */
private Overlay popupOverlay;
@ -128,6 +132,31 @@ public class OpenLayerOSM {
public void onEvent(MapBrowserEvent event) {
// TODO Auto-generated method stub
Coordinate coordinate = event.getCoordinate();
if(queryPoint!=null && queryPoint.getActive()) {
double lon = coordinate.getX();
double lat = coordinate.getY();
int w = (int) map.getSize().getWidth();
int h = (int) map.getSize().getHeight();
// handler.clickOnMap(x, y, w, h);
// ratio - mapPixelWeight : bboxWeight = 10px : geoRectangleWidth
// where 10px is the pixel diameter dimension of the clicked point
double bboxWidth = Math.abs(getExtent().getLowerLeftX() - getExtent().getUpperRightX());
double geoWidth = bboxWidth / w * 10 / 2;
double x1 = Math.min(lon+geoWidth, lon-geoWidth);
double x2 = Math.max(lon+geoWidth, lon-geoWidth);
double y1 = Math.min(lat+geoWidth, lat-geoWidth);
double y2 = Math.max(lat+geoWidth, lat-geoWidth);
GWT.log("("+x1+","+y1+")("+x2+","+y2+")");
Point pt = new Point(coordinate);
ol.Extent extent = pt.getExtent();
selectBox(x1, y1, x2, y2);
}
if(popupOverlay==null) {
Element elPopup = DOM.getElementById("popup");
popupOverlay = addOverlay(elPopup);
@ -147,6 +176,15 @@ public class OpenLayerOSM {
}
/**
* Gets the extent.
*
* @return the extent
*/
public ol.Extent getExtent() {
return this.map.getView().calculateExtent(map.getSize());
}
/**
* Adds the popup closer handelr.
*
@ -206,8 +244,6 @@ public class OpenLayerOSM {
Image wmsLayer = new Image(layerOptions);
map.addLayer(wmsLayer);
//https://data.d4science.org/gis-viewer-app/?wmsrequest=https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https://data.d4science.org/gis-viewer-app/?wmsrequest=https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98https%3A%2F%2Fgeona-proto.d4science.org%2Fgeoserver%2Fconcessioni_conf%2Fwms%3Fservice%3DWMS%26version%3D1.1.0%26request%3DGetMap%26layers%3Dconcessioni_conf%3Acentroids_concessioni%26styles%3D%26bbox%3D8.476%2C39.179%2C17.391%2C45.772%26width%3D768%26height%3D567%26srs%3DEPSG%3A4326%26format%3Dapplication%2Fopenlayers&zoom=6&centermap=12.45%2C42.98
}
@ -217,11 +253,11 @@ public class OpenLayerOSM {
* @return the draw
*/
public Draw addPointVectorSource() {
if(pointDraw==null)
if(queryPoint==null)
initPointInteraction();
map.addInteraction(pointDraw);
return pointDraw;
map.addInteraction(queryPoint);
return queryPoint;
}
/**
@ -235,7 +271,16 @@ public class OpenLayerOSM {
drawOptions.setMaxPoints(1);
drawOptions.setMinPoints(1);
drawOptions.setWrapX(false);
pointDraw = new Draw(drawOptions);
queryPoint = new Draw(drawOptions);
queryPoint.addChangeListener(new EventListener<ol.events.Event>() {
@Override
public void onEvent(ol.events.Event event) {
GWT.log(event.getType());
}
});
}
/**
@ -250,14 +295,15 @@ public class OpenLayerOSM {
/**
* Removes the interactions.
*/
public void removeInteractions() {
public void removeQueryInteractions() {
Collection<Interaction> interactions = map.getInteractions();
if(interactions!=null) {
Interaction[] inters = map.getInteractions().getArray();
for (int i = 0; i < inters.length; i++) {
Interaction inter = inters[i];
map.removeInteraction(inter);
}
map.removeInteraction(queryBox);
map.removeInteraction(queryPoint);
//for (int i = 0; i < inters.length; i++) {
// Interaction inter = inters[i];
// map.removeInteraction(inter);
//}
}
}
@ -273,9 +319,9 @@ public class OpenLayerOSM {
//styleOptions.setStroke(stroke);
//styleOptions.set
//extentOptions.setBoxStyle(new ol.style.Style(styleOptions));
Extent extent = new Extent(extentOptions);
map.addInteraction(extent);
return extent;
queryBox = new Extent(extentOptions);
map.addInteraction(queryBox);
return queryBox;
}
@ -297,6 +343,13 @@ public class OpenLayerOSM {
return overlay;
}
public void selectBox(double x1, double y1, double x2, double y2) {
//ClickDataInfo cdi = new ClickDataInfo(x1, y1, x2, y2);
GWT.log("("+x1+","+y1+")("+x2+","+y2+")");
}

58
src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.java
View File

@ -3,7 +3,10 @@ package org.gcube.portlets.user.geoportaldataviewer.client.ui;
import org.gcube.portlets.user.geoportaldataviewer.client.gis.OpenLayerOSM;
import com.github.gwtbootstrap.client.ui.Button;
import com.github.gwtbootstrap.client.ui.ButtonGroup;
import com.github.gwtbootstrap.client.ui.Tab;
import com.github.gwtbootstrap.client.ui.constants.IconType;
import com.github.gwtbootstrap.client.ui.constants.ToggleType;
import com.google.gwt.core.client.GWT;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
@ -21,60 +24,71 @@ public class GeonaDataViewMainPanel extends Composite {
@UiField
Tab mapTabPanel;
@UiField
Button dataPointSelection;
@UiField
Button dataBoxSelection;
@UiField
ButtonGroup buttonGroup;
private MapPanel mapPanel;
private OpenLayerOSM map;
public GeonaDataViewMainPanel() {
initWidget(uiBinder.createAndBindUi(this));
mapPanel = new MapPanel("600px");
mapTabPanel.add(mapPanel);
dataPointSelection.setToggle(true);
dataBoxSelection.setToggle(true);
bindHandlers();
dataPointSelection.setIcon(IconType.SCREENSHOT);
dataBoxSelection.setIcon(IconType.BOOKMARK);
}
public void setMapHeight(int height) {
mapPanel.setHeight(height +"px");
mapPanel.setHeight(height + "px");
}
public MapPanel getMapPanel() {
return mapPanel;
}
public void setMap(OpenLayerOSM map) {
this.map = map;
}
public void bindHandlers(){
public void bindHandlers() {
dataPointSelection.addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
map.removeInteractions();
map.addPointVectorSource();
map.removeQueryInteractions();
GWT.log("dataPointSelection.isActive() " + dataPointSelection.isActive());
if (!dataPointSelection.isActive()) {
map.addPointVectorSource();
}
dataBoxSelection.setActive(false);
//dataBoxSelection.getElement().removeClassName("active");
}
});
dataBoxSelection.addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
map.removeInteractions();
map.addExtentInteraction();
map.removeQueryInteractions();
GWT.log("dataBoxSelection.isToggled() " + dataBoxSelection.isActive());
if (!dataBoxSelection.isActive()) {
map.addExtentInteraction();
}
dataPointSelection.setActive(false);
//dataPointSelection.getElement().removeClassName("active");
}
});
}
}

8
src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.ui.xml
View File

@ -9,9 +9,11 @@
<b:TabPanel ui:field="mainTabPanel" tabPosition="top">
<b:Tab ui:field="mapTabPanel" active="true" heading="Map">
<b:ButtonToolbar>
<b:ButtonGroup>
<b:Button ui:field="dataPointSelection">Data Point Selection</b:Button>
<b:Button ui:field="dataBoxSelection">Data Box Selection</b:Button>
<b:ButtonGroup toggle="checkbox" ui:field="buttonGroup">
<b:Button ui:field="dataPointSelection" type="PRIMARY">Data Point
Selection</b:Button>
<b:Button ui:field="dataBoxSelection" type="PRIMARY">Data Box
Selection</b:Button>
</b:ButtonGroup>
</b:ButtonToolbar>
</b:Tab>

45
src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/util/MutuallyExclusiveToggleButtonCollection.java Normal file
View File

@ -0,0 +1,45 @@
package org.gcube.portlets.user.geoportaldataviewer.client.ui.util;
import java.util.ArrayList;
import java.util.List;
import com.github.gwtbootstrap.client.ui.Button;
import com.google.gwt.core.client.GWT;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
/**
* The Class MutuallyExclusiveToggleButtonCollection.
*
* @author Francesco Mangiacrapa at ISTI-CNR (francesco.mangiacrapa@isti.cnr.it)
*
* Oct 28, 2020
*/
public class MutuallyExclusiveToggleButtonCollection {
/** The list toggle button. */
List<Button> listToggleButton = new ArrayList<Button>();
/**
* Adds the.
*
* @param button the button
*/
public void add(Button button) {
listToggleButton.add(button);
button.addClickHandler(new ExclusiveButtonClickHandler());
}
private class ExclusiveButtonClickHandler implements ClickHandler {
public void onClick(ClickEvent event) {
for (Button button : listToggleButton) {
GWT.log("Toggle button: " + button.getElement().getId());
boolean isSource = event.getSource().equals(button);
GWT.log("Set active: " + isSource);
button.setActive(isSource);
}
}
}
}

265
src/main/java/org/gcube/portlets/user/geoportaldataviewer/shared/gis/ClickDataInfo.java Normal file
View File

@ -0,0 +1,265 @@
package org.gcube.portlets.user.geoportaldataviewer.shared.gis;
// TODO: Auto-generated Javadoc
/**
* The Class ClickDataInfo.
*
* @author Francesco Mangiacrapa at ISTI-CNR (francesco.mangiacrapa@isti.cnr.it)
*
* Oct 27, 2020
*/
public class ClickDataInfo {
public static enum TYPE {
POINT,
BOX
}
/** The Constant THRESHOLD_AREA. */
private static final double THRESHOLD_AREA = 300;
/** The h. */
private int x, y, w, h;
/** The bbox. */
private String bbox;
/** The type. */
private TYPE type=null;
/** The x 1. */
private double x1;
/** The y 1. */
private double y1;
/** The x 2. */
private double x2;
/** The y 2. */
private double y2;
/** The limit. */
//ADDED BY FRANCESCO M.
private int limit = Integer.MAX_VALUE;
/**
* Instantiates a new click data info.
*
* @param x the x
* @param y the y
* @param w the w
* @param h the h
* @param bbox the bbox
*/
public ClickDataInfo(int x, int y, int w, int h, String bbox) {
super();
this.x = x;
this.y = y;
this.w = w;
this.h = h;
this.bbox = bbox;
this.type = TYPE.POINT;
// System.out.println("POINT SELECTED: x="+x+", y="+y+", w="+w+", h="+h+", bbox="+bbox);
}
/**
* Instantiates a new click data info.
*
* @param x1 the x 1
* @param y1 the y 1
* @param x2 the x 2
* @param y2 the y 2
*/
public ClickDataInfo(double x1, double y1, double x2, double y2) {
this.x1 = x1;
this.y1 = y1;
this.x2 = x2;
this.y2 = y2;
// note: the bounding box is left,lower,right,upper
this.bbox = y1 +","+ x1 +","+ y2 +","+ x2;
this.type = TYPE.BOX;
double area = (x2-x1) * (y2-y1);
// System.out.println("BOX SELECTED: BBOX="+bbox + ", AREA="+area);
}
/**
* Gets the x.
*
* @return the x
*/
public int getX() {
return x;
}
/**
* Sets the x.
*
* @param x the new x
*/
public void setX(int x) {
this.x = x;
}
/**
* Gets the y.
*
* @return the y
*/
public int getY() {
return y;
}
/**
* Sets the y.
*
* @param y the new y
*/
public void setY(int y) {
this.y = y;
}
/**
* Gets the w.
*
* @return the w
*/
public int getW() {
return w;
}
/**
* Sets the w.
*
* @param w the new w
*/
public void setW(int w) {
this.w = w;
}
/**
* Gets the h.
*
* @return the h
*/
public int getH() {
return h;
}
/**
* Sets the h.
*
* @param h the new h
*/
public void setH(int h) {
this.h = h;
}
/**
* Gets the bbox.
*
* @return the bbox
*/
public String getBbox() {
return bbox;
}
/**
* Sets the bbox.
*
* @param bbox the new bbox
*/
public void setBbox(String bbox) {
this.bbox = bbox;
}
/**
* Checks if is point.
*
* @return true, if is point
*/
public boolean isPoint() {
return this.type==TYPE.POINT;
}
/**
* Checks if is box.
*
* @return true, if is box
*/
public boolean isBox() {
return this.type==TYPE.BOX;
}
/**
* Checks if is hard query.
*
* @return true, if is hard query
*/
public boolean isHardQuery() {
if (this.isPoint())
return false;
else {
double area = (x2-x1) * (y2-y1);
return (area > THRESHOLD_AREA);
}
}
/**
* Gets the x1.
*
* @return the x1
*/
public double getX1() {
return x1;
}
/**
* Gets the x2.
*
* @return the x2
*/
public double getX2() {
return x2;
}
/**
* Gets the y1.
*
* @return the y1
*/
public double getY1() {
return y1;
}
/**
* Gets the y2.
*
* @return the y2
*/
public double getY2() {
return y2;
}
/**
* Gets the limit.
*
* @return the limit
*/
public int getLimit() {
return limit;
}
/**
* Sets the limit.
*
* @param limit the new limit
*/
public void setLimit(int limit) {
this.limit = limit;
}
}