DEVELOPMENT OF 3D WEB GIS APPLICATION WITH OPEN SOURCE LIBRARY

Today, thanks to the internet connection, the borders are disappearing and accessing information is more comfortable. Besides desktop applications, number of web-based applications which instant changes can be seen by all users are increasing day by day. The diversity of web-based applications that are currently used in presenting spatial information to users is also progressing. Using open source libraries, developers can develop web applications for their own purposes. Three dimensional (3D) visualization on the web is a commonly used approach in geographic information systems (GIS) applications. In this article, a 3D web application is developed using Cesium open source javascript library. Vector data layers containing attribute data on global, country and city scales are visualized on the web application. Moreover, raster data layers which produced in other projects like GIS-based land valuation application is also visualized in three dimension. It is pointed out that the output products obtained from different studies can be accessed and visualized through the web browser without installing an additional program or add-ons on the users' computers.


INTRODUCTION
Although the Internet was developed for military purposes, it has globalized and evolved into many other areas like trade, academia, information sharing in public institutions (Yomralıoğlu, 2000).Widespread internet usage has led to sharing data and information easily all over the world.This technological development has made possible to visualize, create, store and share spatial data on the web and has emerged Web GIS notion.Web GIS has many advantages when compared to desktop GIS.The applications that have been made for various purposes on the internet which can be used easily without a GIS software.The users can access the current database 24 hours a day, 7 days a week at a low cost with a computer connected to the internet and a web browser.Moreover, users on different platforms can use the data concurrently.Spatial queries and analysis like the nearest distance, an optimum transportation route can be made easily on the web.
The third dimension on maps gives the opportunity to get some details, increase the readability of the map, and provide reality.We need 3D data to manage cities more sustainable.It is significant to create, visualize, store, analyze and share the 3D data for better decision making, planning or solving problems.Lately, the 3D representations of data on the web increasingly have gained importance.Since it does not require any additional software or plugin to visualize and analyze the data, 3D Web GIS has become very popular and integral part of the geospatial community.Several industries such as real estate, tourism, geo-advertising, smart cities take advantage of 3D web maps.
Javascript is a programming language that enables creating interactive and dynamic web pages supported by popular web browsers like Chrome, Firefox, Edge, Opera, Safari.It can be operated on the web without using any plug-in since almost every browser support javascript.Furthermore, JavaScript Application Programming Interfaces (APIs) widely used for creating Web GIS applications.A new approach has seen for 3D Web GIS applications with the development of HTML5 and Web Graphics Library (WebGL) technologies.WebGL allows GPU-accelerated usage of physics and image processing and it is integrated into all the web standards of the browser (Miao et al.,, 2017).In order to render interactive 2D and 3D graphics within any web browser, WebGL JavaScript API can be used.
There are many map libraries for rendering 3D graphics on the web like Cesium JS, WebGL Earth JS API, ArcGIS API for JS, OSM Buildings GL, Vizicities,Tangram,Nasa Java World Wind,wrld3d.In this paper, Cesium JS 3D Map Library is used for creating 3D Web GIS application.Cesium was developed by an open-source community with the Cesium Consortium.Cesium JS uses WebGL for creating 3D globes and 2D maps in a web browser without using a plugin.Since it provides virtual globes with time dynamic 3D visualization of geospatial data, Cesium is functional 3D map library in terms of performance and features when compared with other libraries and frameworks (Chaturvedi et al., 2015).In this study, it is aimed to visualize different vector and raster geospatial data types on the web in 3D.Besides 3D data, city model tour flight is created and visualized with time information in 4D.Visualizing various applications in different scales has made possible to measure performance and efficiency of Cesium open source javascript library.

MATERIAL AND METHODS
3D web mapping library Cesium is based on WebGL.Hence, it is independent of browsers and platforms.2D, 3D, and 4D spatiotemporal data can be visualized efficiently by means of WebGL with Three.jsframework implementation.WebGL can display many data points since it has direct access to the computing unit of the graphics card.Cameras, shaders, and lights to draw lines, spheres, particles, or a plane and some other tools for the representation of the data is provided for developers and many distinct features such as appearance, field of view for the scene, color, texture or size of objects can be easily managed with Three.js(Resch et al., 2014).
Cesium supports many open data formats for 3D rendering.To provide interoperability, Cesium visualizes geospatial data through OGC standards (Prandi et al., 2015).. Using standard data formats like TopoJSON, GeoJSON, and KML, Cesium provides building 3D map applications by supplying expressive tools.Moreover, an open-source community with the support of Cesium Consortium developed data formats which they weren't available for 3D rendering like CZML, 3D Tiles, glTF, and quantized-mesh.CZML is a JSON schema that provides temporal 3D scenes, such as of satellites, and aircraft.3D Tiles is a description for visualizing huge 3D geo-datasets like photogrammetry, CAD, and 3D building models.3D Tiles describe a spatial data structure and a set of tile formats designed for 3D and optimized for streaming and rendering.glTF is an open standard 3D runtime asset format.It can be described as JPEG for 3D.Quantized-mesh provides efficient 3D terrain streaming and rendering.In this paper GeoJSON and glTF data formats used to create 3D web map application.Gross Domestic Product (GDP) Per Capita and population statistics of countries have gathered for 2000, 2010 and 2017 years from World Bank Open Data to visualize on Cesium 3D globe.Figure 1 shows Turkey's GDP Per Capita in 2016.

Figure 1. Turkey's Gross Domestic Product (GDP) Per Capita
In addition, the population of Turkey's provinces and a population of Istanbul's districts were visualized on the 3D globe to test the performance of the application in different data scales (Figure 2-3).
GDP Per Capita and Population data can be visualized according to different years using pop-up buttons at the top of the application page.It is also possible to create CZML data for 4D temporal data to analyze the change in ten year periods for both statistics.Furthermore, nominal land values of Istanbul province were visualized as 3D model in glTF data format on Cesium globe.Figure 4 presents the nominal land values of Istanbul city.In order to convert raster data to glTF format, a three.jslibrary, the Qgis2Threejs plugin was used.It is a python plugin that provides the capability of exporting terrain data, map canvas images and vector data to the browsers benefitting from WebGL (Evangelidis et al., 2018).Since Cesium provides data interoperability, the projects which are created with using other platforms can be integrated easily.3D Nominal Land Values of Istanbul City Project is visualized with Cesium JS.The model is created as pixel-based raster data.In order to visualize it on 3D Cesium globe, raster data converted to glTF format using a three.jslibrary, Qgis2Threejs.glTF data format provides visualization of raster data but users cannot query on the data.
It is possible to create aircraft and drone tour models, animations with Cesium JS.In order to scout sample geocache locations in New York, 3D city model is visualized in Cesium.The model has 1.1 million OSM buildings.In figure 5, New York 3D City Model tour is shown in drone view.

CONCLUSIONS
Third-dimensional data is widely used in many areas such as smart cities, real estate, tourism, planning etc.It is beneficial to visualize it on the web without any additional software or plugin.Thanks to WebGL, 3D geospatial data can be visualized on the web using javascript mapping libraries.Cesium supports many open formats to visualize 2D, 3D and 4D data.In this paper, in order to test GeoJSON and glTF data formats, GDP Per Capita of countries, population, and nominal land value model data are used for 3D visualization on Cesium globe.Further, Cesium JS library provides efficient 4D temporal data, creating animations and mobile 3D scenes.To conclude, Cesium is consistent 3D javascript web mapping library.Using WebGL, it makes possible to visualize 3D data on the globe on a browser without any plugin.

Figure 2 .Figure 3 .
Figure 2. The population of Turkey provinces in 2010

Figure 4 .
Figure 4. 3D Nominal Land Values of Istanbul province