Point Cloud Styling based on color value

CesiumJS
1

I’m using CesiumJS to view point cloud based 3DTiles. I’d like to be able to toggle showing points in a specific color range but it doesn’t seem to work. Should the following code work to hide any points that don’t have a red value of 242?

tileset.style = new Cesium.Cesium3DTileStyle({
show : “${Red} !=242”
});

2

Your point clouds tileset likely doesn’t have the Red property. You may need to access the Color property instead:

tileset.style = new Cesium.Cesium3DTileStyle({
    show : “${COLOR}.x !=242”
});

You may also have to change the 242 to its corresponding value between 0 and 1. We have a specification for 3D Tiles which you can access here: https://github.com/CesiumGS/3d-tiles/tree/master/specification/Styling#point-cloud

3

Thank you. Here are the values I’m seeing in the .pnts file being rendered.

(py3dtiles) [ec2-user@ip-172-31-12-146 ~]$ py3dtiles_info /lidar/cesium/6-61-28-29.pnts
Tile Header

Magic Value: pnts
Version: 1
Tile byte length: 390622
Feature table json byte length: 144
Feature table bin byte length: 390450

Feature Table Header

{‘POINTS_LENGTH’: 26030, ‘RTC_CENTER’: [-402461.359375, -5509823.703125, 3176833.640625], ‘POSITION’: {‘byteOffset’: 0}, ‘RGB’: {‘byteOffset’: 312360}}

First point

{‘X’: -3.470625, ‘Y’: -3.656875, ‘Z’: -3.050625, ‘Red’: 242, ‘Green’: 242, ‘Blue’: 242}

Based on this I’d expect to see the red property unless it’s getting transformed in the API itself. Also, can you expand on converting a color value to between 0 and 1. There is no information on how that’d be done in the link you provided.

4

@omar Any thoughts on how this would be done?

5

For converting values from 0 to 255 to 0 to 1, you can reference this post:

This post might help with the Red attribute not found issue:

It might just be that you need to use !== instead of != for the comparison. Were there any errors that were shown in the console?

6

I’m getting no errors in the console and I’ve tried the following with no success.

“{Red} !== 242" "{Color}.Red !== 242”
“{Red} != 242" "{Color}.Red != 242”
“{Red} !== .949" "{Color}.Red !== .949”
“{Red} != .949" "{Color}.Red != .949”
“{Color}.Red != 242" "{Red} !== ‘F2’”
“{Color}.Red !=='F2'" "{Red} != ‘F2’”
“${Color}.Red != ‘F2’”

Is turning point display on and off with a Lidar based 3DTileset based on color something that’s been tested and known to work?

7

It is known to work. Here is a Sandcastle example of hiding points that are close to WHITE.

1 Like
8

@dzung I’ve applied this example to ion asset id 168554 and it doesn’t seem to work. Would you be able to look at that asset and see why it isn’t? The color I’m trying to turn off should be 242,242,242.

9

@dzung, Can I expect any further assistance on this or am I on my own here?

10

Would it be possible for you to share a Sandcastle with your asset loaded?

11

I took a look at your asset and was able to apply the styles mentioned in my previous post. Please check out this Sandcastle. To apply the style you will need to click on the Apply Style button at the top left corner of the viewer.

12

Yeah, somehow I must have made a mistake when implementing because when I tried building the sandcastle example it worked fine. Appreciate the help!

1 Like