Changes made to wxs.threejs to drape WMTS and TMS tiles

Inspired by the project from Labs Kartverket we have customized their code starting from the simplified fork by atlefren to create our own “3D scene generator

Instructions

WCS service
In order to use the 5x5m terrain model from the ICGC (Institut Cartogràfic i Geològic de Catalunya) we have setup a WCS service in Minnesota Mapserver 6.4.

WMTS.js
Since the WMTS and TMS services we will be using are expressed in EPSG:3857 we got rid of the GetCapabilities request and the parsing of the XML response, and in its place we have “hardcoded” the description, tiling and resolutions of these Google compatible pyramids.

tileMatrixSet=[{"TileMatrixSetIdentifier":"GMTOT","Identifier":"0","ScaleDenominator":559082264.0287179,"TopLeftCorner":{"minx":-20037508.342789,"maxy":20037508.342789},"TileWidth":256,"TileHeight":256,"MatrixWidth":1,"MatrixHeight":1,"TileSpanX":40075016.685578495,"TileSpanY":40075016.685578495,"Zoom":0},{"TileMatrixSetIdentifier":"GMTOT","Identifier":"1","ScaleDenominator":279541132.0143589,"TopLeftCorner":{"minx":-20037508.342789,"maxy":20037508.342789},"TileWidth":256,"TileHeight":256,"MatrixWidth":2,"MatrixHeight":2,"TileSpanX":20037508.342789244,"TileSpanY":20037508.342789244,"Zoom":1},{"TileMatrixSetIdentifier":"GMTOT","Identifier":"2","ScaleDenominator":139770566.0071794,"TopLeftCorner":{"minx":-20037508.342789,"maxy":20037508.342789},"TileWidth":256,"TileHeight":256,"MatrixWidth":4,"MatrixHeight":4,"TileSpanX":10018754.17139462,"TileSpanY":10018754.17139462,"Zoom":2
.....

Wxs.tree.js and Univers.js
We modified the original interrogation method of the WMTS from KVP to make it RESTful in order to query data from ICGC servers. On one side we have created a new variable to carry the URL parameters of a WMTS service, and on the other side we have created another variable to collect the changing parameters of resolution, column and row coming from the Google compatible pyramids.

wmtsUrl1: getQueryVariable("WMTS1") || 'https://mapcache.icc.cat/map/bases_noutm/wmts/orto/GRID3857',
var cache_WMTS ="/"+activeMatrix.Identifier+"/"+tileCol+"/"+tileRow+"."+this.dim.extUrl;

Client.html
We have also migrated from the original OpenLayers client to Leaflet  with the “leaflet.active-layers” plugin.
This client allows us to pass as parameters the current coordinates of the active boundingbox along with the URL of the chosen WMTS service. This way we can create a 3D model of any of the available WMTS or TMS services in 3857.

You may also like...