3DCityDB-Web-Map-Client
News
Version v2.0.0 released!
The 3DCityDB Web Map Client now supports the visualization of various exchange formats: COLLADA/KML/glTF, CZML, GeoJSON, Cesium 3D Tiles and Indexed 3D Scene Layers (I3S).
The latest release now supports displaying thematic data stored from data sources such as Google Spreadsheets (using Google Sheets API v4), PostgreSQL (using PostgREST API) and OGC Feature API. Additionally, existing thematic data embedded within the visualization datasets is also supported.
See release announcements and change logs for the complete list of changes made in this version, as well as in previous ones.
Introduction
The 3DCityDB-Web-Map-Client is a web-based front-end for high-performance 3D visualization and interactive exploration of arbitrarily large semantic 3D city models and other geospatial data. The web client utilizes the Cesium Virtual Globe as its 3D geo-visualization engine based on HTML5 and Web Graphics Library (WebGL) to provide hardware acceleration and cross-platform functionalities like displaying 3D graphic contents on web browsers without the needs of additional plugins.
The key features and functionalities of the 3DCityDB-Web-Map-Client is summarized as follows:
- Support for efficient displaying, caching, prefetching, dynamic loading and unloading of large pre-styled 3D visualization models in the form of tiled KML/glTF datasets exported from the 3DCityDB using the Importer/Exporter
- Intuitive user interface for adding and removing arbitrary number of data layers for 3D visualization (KML/glTF, GeoJSON, Cesium 3D Tiles, I3S), together with WMS/WMTS imagery layer, and Cesium digital terrain model
- Support for linking the 3D visualization models (KML/glTF, GeoJSON, Cesium 3D Tiles, I3S) with external thematic data sources, such as Google Spreadsheets and PostgreSQL/PostgREST, allowing for querying the thematic data of every 3D object
- Support for displaying the existing thematic data embedded within the visualization datasets, such as KML, GeoJSON, Cesium 3D Tiles and I3S
- Support for rich interaction with 3D visualization models, for example, highlighting of 3D objects on mouseover and mouseclick as well as hiding and showing of multiple selected 3D objects
- Support for exploring a 3D object of interest from different view perspectives using third-party mapping services like Microsoft Bing Maps with oblique view, Google Streetview, and a combined version (DualMaps)
- Support for on-the-fly activating and deactivating shadow visualization of 3D objects and Cesium digital terrain models
- Support for collaborative creation and sharing of the workspace of the 3DCityDB-Web-Map-Client by means of generating a scene link including information about the current camera perspective, activation status of the shadow visualization, parameters of the current loaded data layers, etc. This link can be easily shared or bookmarked, and can be reopened in a browser on different machines
- Support for mobile devices (smartphones, tablets, etc.) with live tracking of geolocation and orientation
- Packaged as a Docker image for fast and convenient deployment
Architecture
License
The 3DCityDb-Web-Map-Client is licensed under the Apache License, Version 2.0. See the LICENSE file for more details.
Latest release
All releases are available from the releases section.
This project is also available in Docker, see repository and images.
For convenient use, there is an official web link available for the current version that can be called to directly run the 3DCityDb-Web-Map-Client on your web browser. All past and future versions of the web client are hosted on our server using their own version numbers, so that they will remain accessible and available at any given time.
System requirements
The hardware on which the 3DCityDB-Web-Map-Client will be run must have a graphics card installed that supports WebGL. In addition, the web browser in use must also provide appropriate WebGL support.
You can visit the following website to check whether your web browser supports WebGL or not:
The 3DCityDB-Web-Map-Client has been successfully tested on (but is not limited to) the following web browsers under different desktop operating systems like Microsoft Windows, Linux, Apple Mac OS X, and even on mobile operating systems like Android and iOS.
- Apple Safari
- Mozilla Firefox
- Google Chrome
- Opera
For best performance, it is recommended to use Google Chrome.
Documentation
A complete and comprehensive documentation on the 3DCityDB-Web-Map-Client is installed with the 3DCityDB Importer/Exporter and is also available online.
Contributing
The source codes of this project are available on GitHub. All releases can be found here.
The platform GitHub is also used for collaborating:
- To report bugs found in the software, please create a GitHub issue.
- To contribute code for fixing issues, please create a pull request with the issue id.
- To propose a new feature, please also create a GitHub issue and open a discussion.
Developers
The 3DCityDB-Web-Map-Client has been developed by:
- Son H. Nguyen, Kanishk Chaturvedi, and Thomas H. Kolbe
Chair of Geoinformatics, Technical University of Munich
and with the support from the following cooperation partners:
- Zhihang Yao, Jannes Bolling, Lucas van Walstijn, and Claus Nagel
Virtual City Systems, Berlin
Demos
Mobile Support Extension
New features
The current 3DCityDB-Web-Map-Client is equipped with an extension that provides better support for mobile devices. The extension comes with a built-in mobile detector, which can automatically detect and adjust the client's behaviors accordingly to whether the 3DCityDB-Web-Map-Client is operating on a mobile device. Some of the most important mobile features enabled by this extension are listed as follows:
-
A more lightweight graphical user interface: In order to make the best use of the limited screen real-estate available on mobile devices, some elements are removed or hidden from the web client, such as credit texts and logos, as well as some of Cesium's built-in navigation controls that can easily be manipulated using touch gestures.
-
Visual adjustments:
-
The main toolbox now scales to fit to the screen size. In case of excess lines/length, the toolbox becomes scrollable (see picture below).
-
The infobox displayed when a city object (e.g. building) is clicked is now displayed in fullscreen with scrollable contents, as illustrated below.
-
The loading icon is now shown as a horizontal bar at the bottom of the screen (highlighted by the green box in the picture below).
-
-
Most importantly: The introduction of a GPS button (located on the top right corner in the view toolbar) providing new functionalities involving user's current location and orientation. Namely:
-
GPS "snapshot": shows the user's current position and orientation,
-
Real-time Compass Tracking: periodically shows the user's current orientation with fixed location,
-
Real-time Compass Tracking + Position or the "First-person View" mode: periodically shows the user's current orientation and position.
-
Disable real-time tracking: the camera will then ascend to a higher altitude of the current location.
-
Demos
To test the mobile extension, simply click on one of the following two URLs:
Notes
The mobile extension makes use of the Geolocation API and the DeviceOrientation API in HTML5. The Geolocation API only functions via HTTPS since Google Chrome 50. Therefore, make sure the client is called from an HTTPS page or your own localhost.
Additional important notes:
- Test the client on devices equipped with GPS.
- If the Geolocation API asks for permission to retrieve your current location, select "Allow".
More information
The 3DCityDB-Web-Map-Client is a part of the 3DCityDB Software Suite for managing and working with large semantic 3D city models in CityGML. However, the web client can also be used as a separate stand-alone component.
OGC CityGML is an open data model and XML-based format for the storage and exchange of semantic 3D city models. It is an application schema for the Geography Markup Language version 3 (GML3), the extendible international standard for spatial data exchange issued by the Open Geospatial Consortium (OGC) and the ISO TC211. The aim of the development of CityGML is to reach a common definition of the basic entities, attributes, and relations of a 3D city model. CityGML is an international OGC standard and can be used free of charge.
Acknowledgement
The development of these methods and implementations were supported and partially funded by the company CADFEM within a dedicated collaboration project in the context of the Leonhard Obermeyer Center (LOC) at the Technical University of Munich (TUM).