Hi all! I’m using CesiumJS about 6 months(as that framework is the best for GIS development)
I have got a problem with priority of rendering of billboards(I was think so priority depends on height on the map).
I don’t know how send short code example so rendering billboards and other primitives consists of ES6 class and service.
Inside the class I get a list of info of map objects here:
static attach(objects) {
// this.removeAllObjects();
try {
for (let x = 0; x < objects.length; x++) {
if(!that.linksObject[objects.id]){
that.aggregateEntity(objects);
}
}
} catch (e) {
console.error(e);
}
MapLoading.hide();
}
aggregateEntity method:
aggregateEntity(config) {
if (!config.coordinates || !config.coordinates.length) {
return;
}
if (!config.sensorStatuses) {
config.sensorStatuses = [0, 0, 0, 0, 0, 0, 0, 0, 0];
}
config.billboard = {};
config.pipe = {diametr: 0.5};
config.ellipse = {};
config.additionalBillboardHeight = 0;
switch (config.type) {
case CONSUMER:
return this.configureConsumer(config);
case LATCH:
return this.configureLatch(config);
case JUMPER:
return this.configureLatch(config);
case NODE:
return this.configureNode(config);
case MESSAGE:
return this.configureMessage(config);
case BOUNDARY_POINT:
return this.configureNode(config);
case THROTTLE_NODE:
return this.configureNode(config);
case ACCOUNTING_DEVICES:
return this.configureAccountDevice(config);
case SOURCE_CHPP:
return this.addToCollection(BILLBOARDS, createBillboard, config);
case CENTRAL_THERMAL_DISTRICT:
return this.configureCTD(config);
case BOILERPLATE:
return this.addToCollection(BILLBOARDS, createBillboard, config);
case PIPE:
return this.addToCollection(PIPES, createPipe, config);
case GENERAL_CONSUMER:
return this.configureConsumer(config);
default:
return console.error('Неизвестный тип: ' + type);
}
There is function which return’s object needed for create new billboards:
export function createBillboard({type, coordinates, billboard, hasSensors, id, hasConnectionLost, sensorStatuses, additionalBillboardHeight}, alreadyActive) {
try {
let {longitude, latitude, altitude} = coordinates[0];
let displayData = getDisplayBillboardData(alreadyActive, sensorStatuses, type, hasConnectionLost, hasSensors);
return {
...DEFAULT_BILLBOARD,
...billboard,
id,
// alignedAxis: additionalBillboardHeight && Cesium.Cartesian3.ZERO || Cesium.Cartesian3.UNIT_Z,
distanceDisplayCondition: displayData.distanceDisplayCondition,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
image: displayData.image,
position: Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude + additionalBillboardHeight + (window.$$currentHeight > 3290 ? 28 : window.$$currentHeight > 675 ? 18 : 0)) //EXTRA_HEIGHT_BILLBOARD + additionalBillboardHeight)
};
} catch (e) {
console.error('createBillboard ', e);
}
}
getDisplayBillboardData function:
function getDisplayBillboardData(active, sensorStatuses, type, hasConnectionLost, hasSensors) {
let sensorStatus = sensorStatuses[window.$$activeSensor];
let isSimple = sensorStatus === 0 || sensorStatus === -1 || sensorStatus === 3 || sensorStatus === undefined;
let image = null;
// let commonHeight = 0;
let farDisplayCondition = 29000.0;
const MAX_VIEW_EMPTY_COUNTERS = 680.0;
if (active) {
image = billboardImages[type].active;
// commonHeight = 8;
} else {
// if (wasActive) {
// // commonHeight = -8;
// }
if (type === ENTITY_TYPES.ACCOUNTING_DEVICES) {
if (hasConnectionLost) {
image = billboardImages[type].noSensors;
farDisplayCondition = MAX_VIEW_EMPTY_COUNTERS;
} else {
if (hasSensors) {
if (window.$$activeSensor === ALL_HEATING_OF_CITY.value) {
let maxSensorStatus = Math.max.apply(null, sensorStatuses);
if (maxSensorStatus > 0) {
image = billboardImages[type].warnings;
} else {
image = billboardImages[type].default;
farDisplayCondition = MAX_VIEW_EMPTY_COUNTERS;
// isSimple = true;
}
} else {
if (isSimple) {
image = billboardImages[type].default;
farDisplayCondition = MAX_VIEW_EMPTY_COUNTERS;
} else {
image = billboardImages[type][sensorStatus === 1 && 'low' || sensorStatus === 2 && 'warnings'];
}
}
} else {
farDisplayCondition = MAX_VIEW_EMPTY_COUNTERS;
image = billboardImages[type].noSensors;
}
}
} else {
if(type !== ENTITY_TYPES.MESSAGE){
farDisplayCondition = 2300.0;
}
image = billboardImages[type].default;
}
}
return {
image,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0.0, farDisplayCondition)
};
}
Cesium version is 1.36.0
browser : Google Chrome v.60.0.3112.113
operation system : Windows 10