Creating a point cloud web viewer with Potree

Potree is the de-facto standard web viewer for point clouds. It can display huge point clouds by showing only the relevant parts of the cloud. It can display using all attributes of a LAS/LAZ file and supports measuring in the point cloud and filtering points by attributes. The documentation on how to get a viewer up and running isn’t terribly exhaustive, so here’s a short guide. You need

  • a Windows computer on which to run the Potree Converter
  • a web server
  • a point cloud in LAS or LAZ format. You can use the LAStools for converting other formats.

Place the point cloud in the same directory as the converter. Open a shell in this location and run .\PotreeConverter.exe pointcloud.laz data_converted

On your webserver, create a directory pointclouds. Upload the directory that has been created by Potree to the pointclouds directory, and libs directory that is in the resources/page_template directory to the root directory.

The final step is creating the html page that displays the point cloud. Use the viewer_template.html in the resources/page_template directory as starting point. You need to insert the code that loads the cloud and displays it. I took this from one of the examples:

Potree.loadPointCloud("pointclouds/C37AN1/metadata.json", "C37AN1", e => {
let scene = viewer.scene;
let pointcloud = e.pointcloud;
let material = pointcloud.material;
material.size = 1;
material.pointSizeType = Potree.PointSizeType.ADAPTIVE;
material.shape = Potree.PointShape.SQUARE;

Make sure that the directory names are correct, i.e. that what is C37AN1 in my example is replaced correctly. Upload the html file to the root directory of the server. Loading the html page in Chrome or Firefox should then show the point cloud.

I’ve done this with one tile of AHN4, the result can be viewer here.




Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert