<div dir="ltr"><div>Hello,<br><br>I am trying to view a point cloud on top of wms imagery in iTowns2. Both data is loaded, but the imagery is blocking the point cloud (see screenshots at: <a href="https://drive.google.com/file/d/0B_iWdvcnZj81UE9vaVI3NnUxZGs/view?usp=sharing">https://drive.google.com/file/d/0B_iWdvcnZj81UE9vaVI3NnUxZGs/view?usp=sharing</a> and <a href="https://drive.google.com/file/d/0B_iWdvcnZj81OEhDUU1HeDNOa1U/view?usp=sharing">https://drive.google.com/file/d/0B_iWdvcnZj81OEhDUU1HeDNOa1U/view?usp=sharing</a>). Is there a way to put the imagery properly under the point cloud?<br><br></div>I tried loading the point cloud and imagery in different order and enabling/disabling skirt of tilelayer, but no luck.<br><div><br>I am using windows 10 with Chrome version 60.0.3112.101 (Official Build) (64-bit) and this is the code I'm using:<br><br>var viewerDiv = document.getElementById('viewerDiv');<br>viewerDiv.style.display = 'block';<br><br>itowns.THREE.Object3D.DefaultUp.set(0, 0, 1);<br><br>itowns.proj4.defs('EPSG:28992', '+proj=sterea +lat_0=52.15616055555555 +lon_0=5.38763888888889 +k=0.9999079 +x_0=155000 +y_0=463000 +ellps=bessel +units=m +no_defs');<br><br>var extent = new itowns.Extent(<br>    'EPSG:28992',<br>    149260.453, 149555.000,<br>    410619.451, 410908.357<br>);<br><br>var view = new itowns.View('EPSG:28992', viewerDiv, { logarithmicDepthBuffer: true });<br>view.mainLoop.gfxEngine.renderer.setClearColor(0xcccccc);<br><br>var debugGui = new dat.GUI();<br><br>var tileLayer = itowns.createPlanarLayer("Ortho", extent, {object3d: view.scene})<br>tileLayer.disableSkirt = true;<br>view.addLayer(tileLayer);<br><br>view.addLayer({<br>    update: itowns.updateLayeredMaterialNodeImagery,<br>    url: '<a href="https://geodata.nationaalgeoregister.nl/luchtfoto/rgb/wms">https://geodata.nationaalgeoregister.nl/luchtfoto/rgb/wms</a>',<br>    networkOptions: { crossOrigin: 'anonymous' },<br>    type: 'color',<br>    protocol: 'wms',<br>    version: '1.3.0',<br>    id: 'wms_imagery',<br>    name: 'Actueel_ortho25',<br>    projection: 'EPSG:28992',<br>    transparent: false,<br>    extent: extent,<br>    axisOrder: 'wsen',<br>    options: {<br>        mimetype: 'image/jpeg',<br>    },<br>}, tileLayer);<br><br>function showPointcloud(serverUrl, fileName, table) {<br>    var pointcloud;<br>    var oldPostUpdate;<br>    var controls;<br><br>    // Configure Point Cloud layer<br>    pointcloud = new itowns.GeometryLayer('pointcloud', view.scene);<br>    pointcloud.file = fileName || 'infos/sources';<br>    pointcloud.protocol = 'potreeconverter';<br>    pointcloud.url = serverUrl;<br>    pointcloud.table = table;<br><br>    function placeCamera(position, lookAt) {<br>        view.camera.camera3D.position.set(position.x, position.y, position.z);<br>        view.camera.camera3D.lookAt(lookAt);<br>        // create controls<br>        controls = new itowns.FirstPersonControls(view, { focusOnClick: true });<br>        debugGui.add(controls, 'moveSpeed', 1, 100).name('Movement speed');<br><br>        view.notifyChange(true);<br>    }<br><br>    // add pointcloud to scene<br>    function onLayerReady() {<br>        var ratio;<br>        var position;<br>        var lookAt;<br><br>        debug.PointCloudDebug.initTools(view, pointcloud, debugGui);<br><br>        view.camera.camera3D.far = 2.0 * pointcloud.root.bbox.getSize().length();<br><br>        ratio = pointcloud.root.bbox.getSize().x / pointcloud.root.bbox.getSize().z;<br>        position = pointcloud.root.bbox.min.clone().add(<br>            pointcloud.root.bbox.getSize().multiply({ x: 0, y: 0, z: ratio * 0.5 }));<br>        lookAt = pointcloud.root.bbox.getCenter();<br>        lookAt.z = pointcloud.root.bbox.min.z;<br>        placeCamera(position, lookAt);<br>        controls.moveSpeed = pointcloud.root.bbox.getSize().length() / 3;<br><br>        // update stats window<br>        oldPostUpdate = pointcloud.postUpdate;<br>        pointcloud.postUpdate = function postUpdate() {<br>            var info = document.getElementById('info');<br>            oldPostUpdate.apply(pointcloud, arguments);<br>            info.textContent = 'Nb points: ' +<br>                pointcloud.counters.displayedCount.toLocaleString() + ' (' +<br>                Math.floor(100 * pointcloud.counters.displayedCount / pointcloud.counters.pointCount) + '%) (' +<br>                view.mainLoop.gfxEngine.renderer.info.memory.geometries + ')';<br>        };<br>    }<br><br>    view.addLayer(pointcloud).then(onLayerReady);<br>}<br><br>showPointcloud("<a href="http://localhost:8000/iTownsViewer/data">http://localhost:8000/iTownsViewer/data</a>", "cloud.js", undefined, true);<br><br><br>Any help would be welcome.<br><br>Regards,<br>Chris Lucas<br></div></div>