An opportunity to

Autonavi map is not to force, loading large complex building model performance is not good, can only find professional do 3D map factory cesium to seek an ideal technical solution. It took 2 days to achieve the smooth effect of satellite Earth plus 3D model. In addition, cesium was used to break the limit of Autonavi’s zoom scale (up to 18) and enter the street View to see more details. However, the Cesium scheme also has its problems, which are described later.

Technical solution

Cesium supports two models, using 3D Tiles for displaying large areas of the building or loading glTF models, and the latter for placing individual models. 3D Tiles use a layered loading method called levels of Detail (loD) to quickly load and render the model. This means that a rough model is first loaded in the field of view, and then the details of the whole model are slowly loaded, gradually replacing the model. Visiting this example, you can observe how the model in your field of view goes from blurry to clear.

Implementation steps

Prepare model

In this survey, 3D tiles were used to load the model. Objto3d-tiles provided by Cesiume were used to export tile files. Each tile file contains model.b3dm and tileset.json.

The.b3dm file records the model information, while tileset.json records the location of the model, the path of the.b3dm file, and the relationship with other sub-tiles. With this tileset.json file, the rough model and the detailed model are connected. After the crude model is loaded, cesium automatically iterates through the children item in tileset.json, loads the detailed model declared in children, and after the refine (ADD or REPLACE) parameter determines whether it replaces the original model or overlays it.

Tileset.js file structure "asset": {"version": "0.0", "tilesetVersion": "1.0.0-obj23dtiles"}, "geometricError": 500, "root": { "boundingVolume": { "region": [1.9812667196223426, 0.3977279931116791, 1.98161901607411, 0.39801077589267914, -11.305000305175781, 134.83670043945312], "refine": "ADD", "geometricError": 500, "children": [{"boundingVolume": {"region": { [1.9814442514794284, 0.39777419936273345, 1.9815212909274045, 0.3978240929187335, -3.1728999614715576, }, "geometricError": 200, "refine": "ADD", "content": {"url": "Batchedbhyc/tileset.json"}}]}}, "refine": "ADD", "content": {"url": "Batchedbhyc/tileset.json"}}Copy the code

After you have installed ObjTo3D-Tiles, you can export the tile file using the following commands

obj23dtiles -i model.obj --tileset -p customTilesetOptions.json

The customTilesetOptions json as a configuration file, can specify the coordinates of the export file, the height from the ground, the outsourcing body information

{"longitude": -1.31968, // radian value of longitude at the tile origin (0,0,0). "Latitude ": 0.698874, // Radian value of tile origin dimension. "TransHeight ": 0.0, // tile origin height, in meters. "Region ": true, // Use region as the outsourcing body. "Box ": false, // use box as an outsource. "Sphere ": false // Use sphere as an outsource. }Copy the code

Load model

<div id="cesiumContainer" class="fullSize"></div> <script> Cesium.Ion.defaultAccessToken = 'eyJhbGciO... '; var viewer = new Cesium.Viewer('cesiumContainer'); / / load a model file let tile = viewer. The scene. The primitives. The add (new Cesium. Cesium3DTileset ({url: Modelinfo.url, // preferred leaves: true, skipLevels: 4}); Then (function (argument) {console.log('loaded')}) </script>Copy the code

Existing problems

Using 3D Tiles to load the model, how to achieve loD loading, how to get each map zoom level module is difficult. In this point, the model obtained by uav oblique photography has natural advantages. As long as uav obtains photographic data at different ground heights, it can have original model data of different scaling levels, and then through professional software, it can construct a model tree from rough to fine.

However, the current model is manually built, and I have not found a reliable method to 3Dtile the model, so layered loading cannot be realized. As a result, the loading time of the model in the early stage is prolonged, and the model that is too fine looks rougher after being reduced in size. As you can see, most of the 3D layer work is still in the processing of the model.