RegionChooser: NYC edition.

src/eu/simstadt/regionchooser/RegionChooserBrowserNewYorkEdition.java

+package eu.simstadt.regionchooser;
+
+import java.io.BufferedWriter;
+import java.io.File;
+import java.io.IOException;
+import java.nio.file.Files;
+import java.nio.file.Path;
+import java.nio.file.Paths;
+import java.util.prefs.Preferences;
+import com.vividsolutions.jts.io.ParseException;
+import com.vividsolutions.jts.io.WKTReader;
+import javafx.beans.value.ObservableValue;
+import javafx.concurrent.Worker.State;
+import javafx.geometry.HPos;
+import javafx.geometry.VPos;
+import javafx.scene.layout.Region;
+import javafx.scene.web.WebEngine;
+import javafx.scene.web.WebView;
+import javafx.stage.FileChooser;
+import javafx.stage.Stage;
+import netscape.javascript.JSObject;
+
+
+public class RegionChooserBrowserNewYorkEdition extends Region
+{
+	public class JavaScriptFXBridge
+	{
+		private Path repo;
+		private WKTReader wktReader = new WKTReader();
+
+		public JavaScriptFXBridge() {
+			Preferences userPrefs = Preferences.userRoot().node("/eu/simstadt/desktop");
+			String repoString = userPrefs.get("RECENT_REPOSITORY", null);
+			if (repoString == null) {
+				repo = Paths.get("../TestRepository");
+			} else {
+				repo = Paths.get(repoString);
+			}
+		}
+
+		public void downloadRegionFromCityGML(String wktPolygon, String project, String citygml) throws IOException,
+				ParseException {
+			StringBuffer sb = RegionExtractorNewYorkEdition.selectRegionDirectlyFromCityGML(citygmlPath(project, citygml),
+					wktPolygon);
+
+			File buildingIdsFile = selectSaveFileWithDialog(project, citygml, "selected_region");
+			if (buildingIdsFile != null) {
+				BufferedWriter writer = Files.newBufferedWriter(buildingIdsFile.toPath());
+				writer.write(sb.toString());
+				writer.close();
+			}
+		}
+
+		private File selectSaveFileWithDialog(String project, String citygml, String suffix) {
+			Stage mainStage = (Stage) RegionChooserBrowserNewYorkEdition.this.getScene().getWindow();
+			FileChooser fileChooser = new FileChooser();
+			fileChooser.setTitle("Save CITYGML ids");
+			if (project != null) {
+				fileChooser.setInitialDirectory(repo.resolve(project + ".proj").toFile());
+			} else {
+				fileChooser.setInitialDirectory(repo.toFile());
+			}
+			if (suffix.isEmpty()) {
+				fileChooser.setInitialFileName(citygml);
+			} else {
+				fileChooser.setInitialFileName(citygml.replace(".", "_" + suffix + "."));
+			}
+			FileChooser.ExtensionFilter extFilter = new FileChooser.ExtensionFilter("GML files (*.gml)", "*.gml");
+			fileChooser.getExtensionFilters().add(extFilter);
+			return fileChooser.showSaveDialog(mainStage);
+		}
+
+		public boolean checkIfCityGMLSAreAvailable(String project, String citygml) {
+			Path p = citygmlPath(project, citygml);
+			return Files.isReadable(p);
+		}
+
+		public void log(String text) {
+			System.out.println(text);
+		}
+
+		private Path citygmlPath(String project, String citygml) {
+			return repo.resolve(project + ".proj").resolve(citygml);
+		}
+	}
+
+	final WebView browser = new WebView();
+	final WebEngine webEngine = browser.getEngine();
+
+	public RegionChooserBrowserNewYorkEdition() {
+		//apply the styles
+		getStyleClass().add("browser");
+		String url = RegionChooserFX.class.getResource("website/index_nyc.html").toExternalForm();
+		webEngine.load(url); // load the web page
+		// process page loading
+		webEngine.getLoadWorker().stateProperty().addListener(
+				(ObservableValue<? extends State> ov, State oldState, State newState) -> {
+					if (newState == State.SUCCEEDED) {
+						JSObject win = (JSObject) webEngine.executeScript("window");
+						JavaScriptFXBridge fxapp = new JavaScriptFXBridge();
+						win.setMember("fxapp", fxapp);
+						webEngine.executeScript("console.log = function(message)\n" +
+								"{\n" +
+								"    fxapp.log(message);\n" +
+								"};");
+					}
+				});
+		//add the web view to the scene
+		getChildren().add(browser);
+	}
+
+	@Override
+	protected void layoutChildren() {
+		double w = getWidth();
+		double h = getHeight();
+		layoutInArea(browser, 0, 0, w, h, 0, HPos.CENTER, VPos.CENTER);
+	}
+
+	@Override
+	protected double computePrefWidth(double height) {
+		return 900;
+	}
+
+	@Override
+	protected double computePrefHeight(double width) {
+		return 600;
+	}
+}

src/eu/simstadt/regionchooser/RegionChooserNewYorkEdition.java

+package eu.simstadt.regionchooser;
+
+import java.util.logging.Logger;
+import javafx.application.Application;
+import javafx.scene.Scene;
+import javafx.scene.paint.Color;
+import javafx.stage.Stage;
+
+
+public class RegionChooserNewYorkEdition extends Application
+{
+	private Scene scene;
+	protected final static Logger LOGGER = Logger.getLogger(RegionChooserNewYorkEdition.class.getName());
+
+	@Override
+	public void start(Stage stage) {
+		// create the scene
+		stage.setTitle("RegionChooserNewYorkEdition");
+		scene = new Scene(new RegionChooserBrowserNewYorkEdition(), 1024, 768, Color.web("#666970"));
+		stage.setScene(scene);
+		stage.show();
+	}
+
+	public static void main(String[] args) {
+		launch(args);
+	}
+}
+

src/eu/simstadt/regionchooser/RegionExtractorNewYorkEdition.java

+package eu.simstadt.regionchooser;
+
+import java.io.IOException;
+import java.nio.charset.Charset;
+import java.nio.file.Files;
+import java.nio.file.Path;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+import com.vividsolutions.jts.geom.Coordinate;
+import com.vividsolutions.jts.geom.Geometry;
+import com.vividsolutions.jts.geom.GeometryFactory;
+import com.vividsolutions.jts.geom.Point;
+import com.vividsolutions.jts.io.ParseException;
+import com.vividsolutions.jts.io.WKTReader;
+
+
+public class RegionExtractorNewYorkEdition
+{
+	static private WKTReader wktReader = new WKTReader();
+
+	static public StringBuffer selectRegionDirectlyFromCityGML(Path citygmlPath, String wktPolygon)
+			throws IOException, ParseException {
+		//			Instant start = Instant.now();
+		Geometry poly = wktReader.read(wktPolygon);
+		final GeometryFactory gf = new GeometryFactory();
+		//TODO: Don't read all the file. Not possible for 15GB gml files
+		String s = new String(Files.readAllBytes(citygmlPath), Charset.defaultCharset());
+
+		Pattern cityObjectPattern = Pattern
+				.compile("(?s)<(core:)?cityObjectMember[^>]*>.*?<\\/(core:)?cityObjectMember>\\s*");
+		//TODO: Allow other coordinate systems
+		Pattern nad83CoordinatesPattern = Pattern
+				.compile("(?<![\\d\\.])([23]\\d\\d\\d\\d\\d[\\.\\d]*) ([56]\\d\\d\\d\\d[\\.\\d]*)");
+		Matcher cityObjectMatcher = cityObjectPattern.matcher(s);
+		StringBuffer sb = new StringBuffer();
+		int i = 0;
+		while (cityObjectMatcher.find()) {
+			cityObjectMatcher.appendReplacement(sb, "");
+			String cityObject = cityObjectMatcher.group();
+			Matcher nad83CoordinatesMatcher = nad83CoordinatesPattern.matcher(cityObject);
+			int coordinatesCount = 0;
+			double xTotal = 0;
+			double yTotal = 0;
+			while (nad83CoordinatesMatcher.find()) {
+				coordinatesCount++;
+				xTotal += Double.valueOf(nad83CoordinatesMatcher.group(1));
+				yTotal += Double.valueOf(nad83CoordinatesMatcher.group(2));
+			}
+			double x = xTotal / coordinatesCount;
+			double y = yTotal / coordinatesCount;
+			Coordinate coord = new Coordinate(x, y);
+			Point point = gf.createPoint(coord);
+			if (point.within(poly)) {
+				i++;
+				sb.append(cityObject);
+			}
+		}
+		System.out.println("Buildings found in selected region " + i);
+		cityObjectMatcher.appendTail(sb);
+		//			System.out.println(Duration.between(start, Instant.now()));
+		return sb;
+	}
+
+}

src/eu/simstadt/regionchooser/website/data/citygml_hulls_nyc.kml

+<?xml version="1.0" encoding="UTF-8"?>
+<kml>
+  <Document>
+    <Placemark>
+      <name>Manhattan.gml</name>
+      <ExtendedData>
+        <Data name="project">
+          <value>NewYork</value>
+        </Data>
+      </ExtendedData>
+      <Polygon>
+        <outerBoundaryIs>
+          <LinearRing>
+            <tessellate>1</tessellate>
+            <coordinates>-74.019012,40.7062519,0 -74.0189717,40.7058604,0 -74.0189418,40.7057319,0 -74.0184794,40.7042805,0 -74.0172664,40.7028968,0 -74.015158,40.7011657,0 -74.015107,40.7011428,0 -74.0135003,40.7004843,0 -73.9746149,40.698469,0 -73.9698348,40.7010661,0 -73.9696604,40.7011962,0 -73.969608,40.7498934,0 -73.9696103,40.7577021,0 -73.970055,40.7578905,0 -73.9702186,40.7579597,0 -73.9706688,40.7580941,0 -73.9716929,40.7582638,0 -73.9788927,40.7582855,0 -73.9888251,40.7582835,0 -73.9925648,40.7582471,0 -73.9980335,40.7581217,0 -73.9997291,40.7580401,0 -74.0002613,40.7578747,0 -74.0065919,40.7556662,0 -74.006643,40.7555973,0 -74.0071602,40.7548532,0 -74.0087472,40.7523398,0 -74.0112393,40.7479423,0 -74.019012,40.7062519,0
+</coordinates>
+          </LinearRing>
+        </outerBoundaryIs>
+      </Polygon>
+    </Placemark>
+  </Document>
+</kml>

src/eu/simstadt/regionchooser/website/index_nyc.html

+<html> 
+<head> 
+<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1"> 
+<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
+<title> Simstadt Region Chooser </title>
+<meta name="keywords" content="polygon,creator,google map,v3,draw,paint">
+<meta name="description" content="Google Map V3 Polygon Creator for Simstadt">
+
+<link rel="stylesheet" type="text/css" href="style/style.css">
+
+<script type="text/javascript" src="script/proj4.js"></script>
+<script type="text/javascript" src="script/jquery-1.4.2.min.js"></script>
+<!-- <link rel="stylesheet" href="http://openlayers.org/en/v3.4.0/css/ol.css" type="text/css">
+<script src="http://openlayers.org/en/v3.4.0/build/ol.js" type="text/javascript"></script>
+ -->
+<link rel="stylesheet" href="style/ol.css" type="text/css">
+<!-- <script src="ol-debug.js" type="text/javascript"></script> -->
+<script src="script/ol.js" type="text/javascript"></script>
+<script src="script/turf.js" type="text/javascript"></script>
+
+</head>
+<body>
+
+<div id="header">
+  <ul>
+    <li class="title">
+    Simstadt Region Chooser - New York Edition
+    </li>
+  </ul>
+</div>
+<div id="map" class="map" tabindex="0"></div>
+<div id="side">
+  <div   id="dataPanel">
+  </div>
+</div>
+<input id="reset" value="Reset" type="button" class="navi" disabled/>
+<script src="script/simstadt_openlayers_nyc.js" type="text/javascript"></script>
+</body>
+</html>

src/eu/simstadt/regionchooser/website/script/simstadt_openlayers_nyc.js

+//TODO: Clean up code and don't leave so many global variables
+
+var reset_btn = $('#reset')[0];
+var dataPanel = $('#dataPanel');
+
+proj4.defs("EPSG:32118", "+proj=lcc +lat_1=41.03333333333333 +lat_2=40.66666666666666 +lat_0=40.16666666666666 +lon_0=-74 +x_0=300000 +y_0=0 +ellps=GRS80 +datum=NAD83 +units=m +no_defs"); // http://spatialreference.org/ref/epsg/32118/proj4js/
+
+
+var wgs84Sphere = new ol.Sphere(6378137);
+
+var osm_layer = new ol.layer.Tile({
+	source: new ol.source.OSM()
+});
+
+
+var kml_source = new ol.source.KML({
+	projection : ol.proj.get('EPSG:3857'),
+	url : 'data/citygml_hulls_nyc.kml',
+	extractAttributes : false,
+	extractStyles : false
+});
+
+function polygon_style(color, alpha) {
+	return new ol.style.Style({
+		fill : new ol.style.Fill({
+			color : 'rgba(255, 255, 255,' + alpha + ')'
+		}),
+		stroke : new ol.style.Stroke({
+			color : color,
+			width : 2,
+			lineDash : [ 5, 10 ]
+		}),
+	});
+}
+
+var kml_layer = new ol.layer.Vector({
+	source : kml_source,
+	style : polygon_style('#777777', 0.2)
+});
+
+var intersections = new ol.source.Vector();
+
+var intersections_layer = new ol.layer.Vector({
+	source : intersections,
+	style : new ol.style.Style({
+		fill : new ol.style.Fill({
+			color : 'rgba(255, 155, 51, 0.2)'
+		})
+	})
+});
+
+var map = new ol.Map({
+	target : 'map',
+	layers : [ osm_layer, kml_layer, intersections_layer ],
+	interactions : ol.interaction.defaults({
+		keyboard : true
+	})
+});
+
+var geoJSONformat = new ol.format.GeoJSON();
+
+kml_layer.addEventListener("change", function() {
+	map.getView().fitExtent(kml_source.getExtent(), (map.getSize()));
+});
+
+function updateGMLPolygons() {
+	kml_source.forEachFeature(function(feature) {
+		feature["geoJSON"] = geoJSONformat.writeFeatureObject(feature);
+		feature["area"] = feature.getGeometry().getArea();
+		var project = feature.get("project");
+		var name = feature.get("name");
+		feature["description"] = project + ">" + name;
+		feature["source"] = "CityGML";
+		var citygmlHere;
+		if (fromJavaFX) {
+			citygmlHere = fxapp.checkIfCityGMLSAreAvailable(project, name);
+		}
+		feature["available"] = citygmlHere;
+	});
+}
+
+// The features are not added to a regular vector layer/source,
+// but to a feature overlay which holds a collection of features.
+// This collection is passed to the modify and also the draw
+// interaction, so that both can add or modify features.
+var featureOverlay = new ol.FeatureOverlay({
+	style : new ol.style.Style({
+		fill : new ol.style.Fill({
+			color : 'rgba(255, 155, 51, 0.5)'
+		}),
+		stroke : new ol.style.Stroke({
+			color : '#ffcc33',
+			width : 4
+		}),
+		image : new ol.style.Circle({
+			radius : 5,
+			fill : new ol.style.Fill({
+				color : '#ffcc33'
+			})
+		})
+	})
+});
+featureOverlay.setMap(map);
+
+var selected_features = featureOverlay.getFeatures();
+selected_features.on('add', function(event) {
+	var feature = event.element;
+	feature.on("change", function() {
+		displayInfo();
+	});
+});
+
+var modify = new ol.interaction.Modify({
+	features : featureOverlay.getFeatures(),
+	// the SHIFT key must be pressed to delete vertices, so
+	// that new vertices can be drawn at the same position
+	// of existing vertices
+	deleteCondition : function(event) {
+		return ol.events.condition.shiftKeyOnly(event) && ol.events.condition.singleClick(event);
+	}
+});
+map.addInteraction(modify);
+
+var draw = new ol.interaction.Draw({
+	features : featureOverlay.getFeatures(),
+	type : 'Polygon'
+});
+map.addInteraction(draw);
+
+var sketch;
+var fromJavaFX;
+
+draw.on('drawstart', function(evt) {
+	fromJavaFX = (typeof fxapp !== 'undefined');
+	sketch = evt.feature;
+	reset_btn.disabled = false;
+	updateGMLPolygons();
+});
+var sourceProj = map.getView().getProjection();
+
+function findIntersections() {
+	var sketch_area = sketch.getGeometry().getArea();
+	var poly1 = geoJSONformat.writeFeatureObject(sketch);
+	var intersection_found = false;
+	intersections.clear();
+	function findIntersection(feature) {
+		try {
+			var jsonIntersection = turf.intersect(poly1, feature["geoJSON"]);
+			if (undefined !== jsonIntersection) {
+				if (!intersection_found) {
+					dataPanel.append("Intersection found with :<br/>\n");
+					intersection_found = true;
+				}
+				var intersection = geoJSONformat.readFeature(jsonIntersection);
+				var intersectionArea = intersection.getGeometry().getArea();
+				var citygml_percentage = Math.round(intersectionArea / feature["area"] * 100);
+				var sketch_percentage = Math.round(intersectionArea / sketch_area * 100);
+				intersections.addFeature(intersection);
+
+				var description;
+				if (feature["available"]) {
+					description = "<a href=\"#\" onclick=\"downloadRegionFrom" + feature["source"] + "(" + i
+							+ ");return false;\">" + feature["description"] + "</a>";
+					// console.log(description);
+				} else {
+					description = feature['description'];
+				}
+
+				dataPanel.append(description + " (" + citygml_percentage + "%");
+				if (sketch_percentage == 100) {
+					dataPanel.append(", all inside");
+				}
+				dataPanel.append(")<br/>\n");
+			}
+
+		} catch (err) {
+			console.log(feature.get('description') + " - " + err);
+		}
+		i++;
+	}
+	var i = 0;
+	kml_source.forEachFeature(findIntersection);
+	if (!intersection_found) {
+		dataPanel.append("No intersection found with any CityGML or NovaFactory product<br/>\n");
+	}
+}
+
+function downloadRegionFromCityGML(i) {
+	// TODO: Disable all links
+	// TODO: DRY
+	$("html").addClass("wait");
+	var feature = kml_source.getFeatures()[i];
+	// Waiting 100ms in order to let the cursor change
+	setTimeout(function() {
+		// var start = new Date().getTime();
+		fxapp.downloadRegionFromCityGML(sketchAsWKT(), feature.get("project"), feature.get("name"));
+		// var end = new Date().getTime();
+		// var time = end - start;
+		// console.log('DL Execution time: ' + time);
+		setTimeout(function() {
+			$("html").removeClass("wait");
+			dataPanel.append("Done<br/>\n");
+		}, 100);
+	}, 100);
+}
+
+function displayInfo() {
+	// var start = new Date().getTime();
+	dataPanel.empty();
+	var geom = /** @type {ol.geom.Polygon} */
+	(sketch.getGeometry().clone().transform(sourceProj, 'EPSG:4326'));
+	var coordinates = geom.getLinearRing(0).getCoordinates();
+	var area = Math.abs(wgs84Sphere.geodesicArea(coordinates));
+	var coords = geom.getLinearRing(0).getCoordinates();
+	if (!fromJavaFX) {
+		var nad83_coords = "";
+		var wgs84_coords = "";
+		var n = coords.length;
+		for (var i = 0; i < n; i++) {
+			var wgs84_coord = coords[i];
+			// wgs84_coords += "regionPolygon.add(new Coord(" + wgs84_coord[1] +
+			// "," + wgs84_coord[0] + "));<br/>";
+			wgs84_coords += "(" + wgs84_coord[1] + "," + wgs84_coord[0] + ")<br/>";
+
+			var nad83_coord = ol.proj.transform(coords[i], ol.proj.get('EPSG:4326'), ol.proj.get('EPSG:32118'));
+			nad83_coords += "(" + nad83_coord[0] + "," + nad83_coord[1] + ")<br/>";
+		}
+		dataPanel.append("WGS84 Coordinates<br/>");
+		dataPanel.append(wgs84_coords + "<br/>\n");
+		dataPanel.append("NAD83 Coordinates<br/>");
+		dataPanel.append(nad83_coords + "<br/>\n");
+	}
+	dataPanel.append("Area" + "<br/>\n");
+	dataPanel.append((Math.round(area / 1000) / 10).toString() + " ha<br/><br/>\n");
+	findIntersections();
+	// var end = new Date().getTime();
+	// var time = end - start;
+	// console.log('Execution time: ' + time);
+}
+
+draw.on('drawend', function() {
+	displayInfo();
+	draw.setActive(false);
+});
+
+$('#reset').click(function() {
+	try {
+		draw.finishDrawing();
+	} finally {
+		dataPanel.empty();
+		$("html").removeClass("wait");
+		draw.setActive(true);
+		featureOverlay.getFeatures().clear();
+		intersections.clear();
+		reset_btn.disabled = true;
+		focusOnMap();
+	}
+});
+
+function sketchAsWKT(epsgId) {
+	epsgId = (typeof epsgId === 'undefined') ? '32118' : epsgId;
+	var wktFormat = new ol.format.WKT();
+	return wktFormat.writeFeature(sketch, {
+		dataProjection : ol.proj.get('EPSG:' + epsgId),
+		featureProjection : ol.proj.get('EPSG:3857')
+	});
+}
+
+function focusOnMap() {
+	$('#map').focus();
+	// $('#map').scrollIntoView();
+}
+
+focusOnMap();
\ No newline at end of file