Skip to content
Cesium-based 3D viewer and JavaScript API for the 3D City Database
JavaScript HTML CSS
Branch: master
Clone or download
Latest commit 60a36aa Oct 4, 2019

README.md

3DCityDB-Web-Map-Client

News

[Oct 1, 2019] Version v1.8.0 released! Read the change logs here.

[Mar 1, 2019] Version v1.7.1 released! Read the change logs here.

[Sep 15, 2018] The current 3DCityDB Web Map Client version v1.6.1 is included in the newest major release v4.0 of the 3DCityDB.

[Mar 28, 2018] Docker images for the 3DCityDB are now available under Web-Map-Client, 3DCityDB PostGIS, Web Feature Service (WFS) and Service orchestration.

[Sep 5, 2017] Mobile support has been implemented to the web client. Read more...

Introduction

The 3DCityDB-Web-Map-Client is a web-based front-end of the 3DCityDB for high-performance 3D visualization and interactive exploration of arbitrarily large semantic 3D city models in CityGML. It 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 like 3D visualization model (KML/glTF), WMS imagery layer, and Cesium digital terrain model
  • Support for linking the 3D visualization models (KML/glTF) with the cloud-based Google Fusion Table allowing for querying the thematic data of every 3D object
  • Support for rich interaction with 3D visualization models (KML/glTF), for example, highlighting of 3D objects on mouseover and mouseclick as well as hiding and showing of the 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 (only for glTF, KML is currently not supported yet) 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.

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

The latest stable release of the 3DCityDB-Web-Map-Client is 1.7.1.

All releases are available from the releases section.

For convenient use, there is an official web link available that can be called to directly run the 3DCityDb-Web-Map-Client on your web browser.

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:

http://get.webgl.org/

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

  • To file bugs found in the software create a GitHub issue.
  • To contribute code for fixing filed issues create a pull request with the issue id.
  • To propose a new feature create a GitHub issue and open a discussion.

Developers

The 3DCityDB-Web-Map-Client has been developed by:

and with the support from the following cooperation partners:

Demos

Demo 1: Visualization of different LoD3 CityGML top-level features (TINRelief, Building, Bridge, Tunnel, WaterBody, Vegetation, CityFurniture, Transportation etc.) in glTF format

Demo 2: Visualization of semantic 3D City Model of Berlin. This Demo shows all Berlin buildings (> 500,000) with textured 3D geometries (LoD2) and thematic attributes per building

Demo 3: Visualization of semantic 3D City Model of Berlin. This Demo shows all Berlin buildings (> 500,000) with different level of detail 3D geometries (LoD1 and LoD2) and thematic attributes per building

Demo 4: Visualization of semantic 3D city model of New York City (NYC). This Demo shows all NYC buildings (> 1 million), roads (> 140,000), and lots (> 800,000), all with 3D geometries (LoD1) and thematic attributes per object

Demo 5: Visualization of semantic 3D landscape model of Vorarlberg. This Demo shows around 9800 attributed LoD2 buildings along with a high-resolution (0.5 meter) digital terrain model

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" (single-click): shows the user's current position and orientation,

    • Real-time Compass Tracking (double-click): periodically shows the user's current orientation with fixed location,

    • Real-time Compass Tracking + Position (triple-click) or the "First-person View" mode: periodically shows the user's current orientation and position.

    • To disable real-time tracking, simply either click on the button again to return to "snapshot" mode or hold the button for 1 second, 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.

Since the 3DCityDB-Web-Map-Client may cause a large amount of data traffic, it is recommended to connect your mobile device to an available WLAN before starting the client.

Additional important notes:

  • If the browser informs you about the webpage not having a valid certificate, click "Advanced" -> "Continue" to proceed.
  • Test the client on devices equipped with GPS.
  • If the Geolocation API asks for permission to retrieve your current location, select "Allow".

More information

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.1.1 (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.

You can’t perform that action at this time.