Hello Everyone,
I have a slight problem… i want the curvy way to be a little lower. To grasp a better example, can you please look at my attachment, originally, the arrow is yellow in color and travel in a higher curvy way. I would rather want the red curvy way than the yellow curvy way.
So what i have done it:
1.i designed the starting point and destination point to allow the arrow to travel from point to point. then the arrow travel from point to point in a curvy way.
I apologize if my English is Bad…
My code is found below…
var startPoint = Cesium.Cartographic.fromDegrees(sourceLongitude, sourceLatitude);
var finalPoint = Cesium.Cartographic.fromDegrees(destLongitude, destLatitude);
// Calculate the midPoint to form the arc out of the earth surface
//Initializes a geodesic on the ellipsoid connecting the two provided planetodetic points.
var geodesic = new Cesium.EllipsoidGeodesic(startPoint, finalPoint);
var midPoint = geodesic.interpolateUsingFraction(0.5, new Cesium.Cartographic());
// Different heights for each attack polyline (1000000 ~ 5000000)
//var rand = [Math.floor((Math.random() * 700000) + 500000)];
var rand = [Math.floor((Math.random() * 700000) + 500000)];
midPoint.height = rand;
var positions = computePositions(startPoint, midPoint, finalPoint, start, duration);
var target = viewer.entities.add({
name: (sourceCountry + " - " + destCountry),
position: positions,
orientation: new Cesium.VelocityOrientationProperty(positions),
path: {
resolution: 1,
/*material: new Cesium.PolylineGlowMaterialProperty({
glowPower: 0.1,
color: Cesium.Color.YELLOW
}),*/
//material: new Cesium.PolylineArrowMaterialProperty(Cesium.Color.RED), // by tschia attackArrowColour
material: attackArrowColour(devicetype,alert),
width: 20,
//trailTime: 12460*60,
trailTime: duration, // original is duration
leadTime: 0
},
});
//console.log(“TSDebug after init target\n”);
target.position.setInterpolationOptions({
interpolationDegree: 0.5,
interpolationAlgorithm: Cesium.LagrangePolynomialApproximation
//Cesium.LagrangePolynomialApproximation
});
/*var inip ="<?php echo $InternalIP; ?>";
*/
//console.log(“TSDebug devicetype at src [”+devicetype+"]\n");
//console.log(“TSDebug sourceIP [”+sourceIP+"]\n");
var sourceColour =setIntIPSourceColour(sourceIP,devicetype);
//console.log(“TSDebug sourceColour [” + sourceColour+"] for devicetype["+devicetype+"]\n" );
var srcPoint = Cesium.Cartographic.fromDegrees(sourceLongitude, sourceLatitude);
var srcPosition = compSrcDstPosition(srcPoint,srcPoint,start, duration);
var sourcePoint = viewer.entities.add({
name: sourceCountry,
//position : Cesium.Cartesian3.fromDegrees(sourceLongitude, sourceLatitude),
position : srcPosition,
point : {
pixelSize : 10,
/*color : new Cesium.CallbackProperty(
function(time, result){
//return Cesium.Color.fromAlpha(Cesium.Color.BLUE,
return Cesium.Color.fromAlpha(sourceColour,
(new Date(time).getTime() % 1000) / 1000,
result);
}, false),*/
color : sourceColour
//outlineColor: Cesium.Color.BLACK,
//outlineWidth: 2
},
});
//console.log("devicetype at dest "+devicetype);
//console.log("destIP "+destIP + " destCountry "+destCountry );
var destColour = setIntIPSourceColour(destIP,devicetype);
//var destColour = setIntIPSourceColour(dstIP);
var dstPoint = Cesium.Cartographic.fromDegrees(destLongitude, destLatitude);
var dstPosition = compSrcDstPosition(dstPoint,dstPoint,start, duration);
var destPoint = viewer.entities.add({
name: destCountry,
//position : Cesium.Cartesian3.fromDegrees(destLongitude, destLatitude),
position : dstPosition,
point : {
pixelSize : 10,
/*color : new Cesium.CallbackProperty(
function(time, result){
//return Cesium.Color.fromAlpha(Cesium.Color.YELLOW,
return Cesium.Color.fromAlpha(destColour,
(new Date(time).getTime() % 1000) / 1000,
result);
}, true),*/
color : destColour
//outlineColor: Cesium.Color.BLACK,
//outlineWidth: 2
},
description: '
COUNTRY: ’ + destCountry + ‘
’ + '
CITY: ’ + destCity +
'
ALERT: '+ alert + ‘
’+ '
Device Type: ’ + devicetype+
‘
’
});
viewer.trackEntity = target;
} // end of for loop
//console.log(“TSDebug before next i[”+i+"]\n");
}); // end of parsing json data
/*
- FUNCTION TO HELP CREATE THE MAIN ATTACK ANIMATION LINE
*/
function computePositions(startPoint, midPoint, finalPoint, start, duration){
//console.log(“computePositions startPoint [”+startPoint+"] finalPoint["+finalPoint+"] start["+start+"]\n");
var property = new Cesium.SampledPositionProperty();
var startPosition = viewer.scene.globe.ellipsoid.cartographicToCartesian(startPoint);
property.addSample(start, startPosition);
var midTime = Cesium.JulianDate.addSeconds(start, duration/2, new Cesium.JulianDate());
var midPosition = viewer.scene.globe.ellipsoid.cartographicToCartesian(midPoint);
property.addSample(midTime, midPosition);
var endTime = Cesium.JulianDate.addSeconds(start, duration, new Cesium.JulianDate());
var endPosition = viewer.scene.globe.ellipsoid.cartographicToCartesian(finalPoint);
//console.log("computePositions eeeeeeeeeeeeeee " + endTime );
property.addSample(endTime,endPosition);
return property;
};
