So I have ran into an issue when using PolylineOutlineMaterialProperty,
If I have multiple entities that are constantly updating their polylines, and I try to display them using the PolylineOutlineMaterialProperty,
I get an error like this (scroll down for reproduction steps and sandcastle example) :
Here’s my code (instructions follows below)
var viewer = new Cesium.Viewer(‘cesiumContainer’);
// This flag determines which material type to use on a polyline
var isOutlineMaterialUsed = false;
// Keep here the interval id to be able to stop updates
var intervalId;
Sandcastle.addDefaultToolbarButton(‘ColorMaterial’, function () {
// The polyline will use a ColorMaterial
isOutlineMaterialUsed = false;
});
Sandcastle.addToolbarButton(‘PolylineOutlineMaterial’, function () {
// The polyline will use a PolylineOutlineMaterial
isOutlineMaterialUsed = true;
});
Sandcastle.addToolbarButton(‘Resume Updates’, function () {
// Start updating the entities
intervalId = setInterval(updateEntities, 2000);
});
Sandcastle.addToolbarButton(‘Stop Updates’, function () {
// Stop updating the entities
if (intervalId) {
intervalId = clearInterval(intervalId);
}
});
// Create and add a datasource
var dataSource = new Cesium.CustomDataSource(‘myDataSource’);
viewer.dataSources.add(dataSource);
// Create an array to store the entities, just for easier access
var entityData = ;
// Prepartion code to create entities
var lon = -80.0;
var lat = 40.0;
/**
- Given an amount, creates entities near each other with a random color
**/
function createEntities(amount) {
for (var idx = 0; idx < amount; idx++) {
// Move the entity slightly off by longitude
var currentLongitude = lon + (idx * 0.01);
var startPosition = Cesium.Cartesian3.fromDegrees(currentLongitude, lat);
// Add the entity with a point graphics of a random color
var entity = dataSource.entities.add({
id: 'entity' + idx,
point: {
pixelSize: 12,
color: Cesium.Color.fromRandom({ alpha: 1.0 }),
outlineWidth: 2.0,
outlineColor: Cesium.Color.BLACK
},
position: startPosition
});
// Store the entity data for easier access later
entityData.push({
positions: [[currentLongitude, lat]],
positionsCartesian: [startPosition],
entity: entity,
});
}
}
/**
-
Invoked in intervals, updates all entities to a new position, by shifting the latitude a bit northern from it’s current location.
-
Each time, a point is added to a polyline. This simulates updates from a server
**/
function updateEntities() {
// Iterate over the entity data kept earlier
for (var e of entityData) {
// Take the last saved position and add an offset to the latitude
var lastPositionDegrees = e.positions[e.positions.length - 1];
var newPosition = [
lastPositionDegrees[0],
lastPositionDegrees[1] + 0.005
];
// Store the new position, and convert to cartesian
e.positions.push(newPosition);
var newCartesian = Cesium.Cartesian3.fromDegrees(newPosition[0], newPosition[1]);
e.positionsCartesian.push(newCartesian);
// The polyline's color will be the entity's color
var materialColor = e.entity.point.color.getValue(0);
var material;
// Create the material based on user's selection
if (isOutlineMaterialUsed) {
// This causes a strange buggy behaviour eventually leading to an exception!
material = new Cesium.PolylineOutlineMaterialProperty({
color: materialColor,
outlineWidth: 4.0
});
} else {
// Create a simple color material
material = new Cesium.ColorMaterialProperty(materialColor);
}
// Each update, create a new polyline for the entity, using the accumulated positions,
// the material created above and a constant width.
e.entity.polyline = {
positions: e.positionsCartesian.slice(),
material: material,
width: 6.0
}
// Move our entity to the new position
e.entity.position = newCartesian;
}
}
// Create two entities to demonstrate the bug
createEntities(2);
// Zoom to our entities
viewer.zoomTo(dataSource);
``
-
Run the example
-
Click ‘Resume Updates’
-
After the polylines begin to grow, click ‘PolylineOutlineMaterial’ button,
-
Watch how the polylines dissapear except the first
-
Click on the point whose polyline have dissapeared - exception!
If I use ColorMaterial, everything works fine. Look at the provided screenshot - when switching to a PolylineOutlineMaterial, the second polyline dissappears
The problem is related to a missing primitive when calculating the bounding sphere inside StaticGeometryPerMaterialBatch class.
I’m here for further explaining if I wasn’t so clear about the issue,
Thanks!
-Mati