I need to draw a LOT of arrows and need they to be primitives because it is the only way to draw arrows on Cesium.
But I need depthTestAgainstTerrain
to be setted as true too.
This will make my arrows to "disapear" above the ground even with clampToGround
.
This is what I've done (Sory.. you'll need to fly to there ):
var viewer = new Cesium.Viewer('cesiumContainer');
var scene = viewer.scene;
scene.globe.depthTestAgainstTerrain = true;
// Create sample polyline primitive.
var polylines = scene.primitives.add(new Cesium.PolylineCollection());
var centerLon = -42.25;
var centerLat = -22.25;
var angle = 47;
var distance = 50000;
var nPos = project( centerLat, centerLon, distance, angle );
console.log( JSON.stringify( nPos ) );
var polyline = polylines.add({
positions : Cesium.Cartesian3.fromDegreesArray([centerLon, centerLat, nPos.lon, nPos.lat]),
material: Cesium.Material.fromType('PolylineArrow', {
color: new Cesium.Color.fromBytes(255, 255, 0, 185)
}),
width : 15.0,
clampToGround : true
});
function project( lat, lon, distance, angle ){
var radian = Cesium.Math.toRadians(angle);
var ellipsoid = Cesium.Ellipsoid.WGS84;
var firstPos = Cesium.Cartesian3.fromDegrees(lon,lat, 0);
var ENU = Cesium.Transforms.eastNorthUpToFixedFrame(firstPos, ellipsoid);
var offsetX = distance * Math.sin(radian);
var offsetY = distance * Math.cos(radian);
var offset = new Cesium.Cartesian3(offsetX, offsetY, 0);
var thePosition = Cesium.Matrix4.multiplyByPoint(ENU, offset, new Cesium.Cartesian3());
const cartographic = Cesium.Cartographic.fromCartesian( thePosition );
const longitude = Cesium.Math.toDegrees(cartographic.longitude);
const latitude = Cesium.Math.toDegrees(cartographic.latitude);
return { lat: latitude, lon: longitude };
}
How can I use "clampToGround" and yet using primitives ?
SOLUTION FROM ZhefengJin ANSWER:
You can use GroundPolylinePrimitive.
This is the Sandcastle link
Source code is here