Working with instances

CesiumJS
1

1. A concise explanation of the problem you’re experiencing.

Here is a sandcastle model with some box instances

  1. How to zoom to the instances automatically (ps, they are in Singapore)?

  2. How to create black outlines for the white boxes?

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

See the sandcastle

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

Generate models of buildings with multiple floors, where each floor is an instance

4. The Cesium version you’re using, your operating system and browser.

Win 7, latest Chrome, Cesium sandcastle

2

Hi there,

There’s no function to zoom to a primitive directly, but I would recommend creating an array of BoudingSphere’s based on the primitive positions and sizes, combining them into one with BoudingSphere.fromBoundingSpheres, and using Camera.zoomToBoundingSphere.

Also checkout the Cesium Geometry and Appearances tutorial for how to create outlines. You’ll need to create a second geometry that is just the outline.

Thanks,

Gabby

3

Hi Gabby,

Thanks, I got the zoom to work fine

But the outline box is still giving me an error. Here is the new sandcastle. I looked at the “Geometry and Appearance” tutorial and went through it a few times, but still could not figure out what I am doing wrong.

The error is:

An error occurred while rendering. Rendering has stopped.

undefined

DeveloperError: Appearance/Geometry mismatch. The appearance requires vertex shader attribute input ‘compressedAttributes’, which was not computed as part of the Geometry. Use the appearance’s vertexFormat property when constructing the geometry.

``

Patrick

4

Hey Patrick,

It looks like the shader is looking for a vertex attribute that isn’t there with the outline. Try setting flat: true in the PerInstanceColorAppearance when drawing the outline. Here’s a working example. Hopefully that fixes your issue!

5

Dear Omar,

That is great, thanks! Now I have another small issue. I am trying to get shadows, but they refuse to appear. I have tried various things but the tutorials only describe how to do it with entities, not primitives.

Here is my updated sandcastle.

Thanks

Patrick

6

Glad I could help Patrick!

It looks like the shadows are working, you just need to get it to a time of the day when the sun is overhead. You can do that with the timeline scrubber widget at the bottom. Here’s a particular time of day I found where the shadows do appear, that you can set programmatic ally with this line:

viewer.clock.currentTime.secondsOfDay = 62624;

``

(I got this by using the scrubber then outputting that value).

7

Ah, my mistake. I did not think of that. Works fine now.

Here is the updated example.

Thanks Omar.

8

Now I am trying to replace the boxes with polygons.

Here is the sandcastle.

I have two problems.

  1. I would like the polygon to sit on the terrain. But if I try to set the coords to z = 0, I get an error.

var points3 = ;

points3.push(Cesium.Cartesian3.fromArray([0, 0, 0]));

points3.push(Cesium.Cartesian3.fromArray([50, 0, 0]));

points3.push(Cesium.Cartesian3.fromArray([50, 30, 0]));

``

The error says:

An error occurred while rendering. Rendering has stopped.
undefined
DeveloperError: normalized result is not a number

``

  1. If I try to extrude the polygon, it crates a crazy extruded shape that is wrong size / wrong location.

var polyBlockGeom = new Cesium.PolygonGeometry({

polygonHierarchy: new Cesium.PolygonHierarchy(points3),

vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT,

perPositionHeight: true,

extrudedHeight : 30

});

``

Thanks in advance for any help…

Patrick

9

I think your code is completely correct Patrick. This might be a bug in Cesium in how it handles the modelMatrix. The problem with (0,0,0) is that it will throw an exception any time Cesium tries to normalize it (it will try to divide by 0). Even if you wiggle the x to 0.01, it’ll work but you’ll get z fighting since the polygon has the same exact position as the surface. A more robust way in general to put polygons on the ground (especially when it includes terrain) is to use GroundPrimitive instead of Primitive (but I think GroundPrimitve doesn’t support extrudedHeight).

So here’s what I did: I manually multiplied the points for each geometry instance by the matrix (which means you end up creating more geometries but you still have the same efficiency of one primitive rendering many instances). I also used height: 0.01 instead of perPositionHeight: trueto make it easier to position the polygon. I think this should work the way you expect it to. Here’s the example.

Your original design with the modelMatrix should work, and I’ll file a bug for that. Thanks for bringing this up and posting about it on the forum! If you run into anything else please feel free to keep posting here or make a new thread if it’s a sufficiently separate issue.