Welcome to reprint, reprint with the article source link ~~, I hope my experience can help you, have a problem you can click my avatar plus my wechat this article only to provide a solution to the problems encountered, for those who urgently want to achieve functional effect, I hope to be able to slightly sink down to watch, or directly watch the train of thought, The code of this article can not be used directly, the complete code is only the problem solved in this article to use the code, if directly used may have an error, as long as you modify the code can be used

Cesium encapsulates a class for orbital trajectories

This method generates a running track, with the default track running in red and the track about to run in green

The renderings are as follows

The following code

Cesium encapsulation / * * * * create orbital coordinates for orbital create plug-in needs to be line said * orbital coordinates, please use the array format Cartesian3 deposit, As shown in the following * pos. Push (new Cesium. Cartesian3. FromDegrees (0, 0, 4000000)) * configuration items configuration is as follows: {viewer: Cesium viewer, our lineWidth: Line width, postype: coordinate point type, the default can not pass, out: {track running is completed configuration item name: name, positions: coordinate point, color: Cesium Color. Color. GREEN | | new Cesium. Color (0255, 1),}, in: {the orbit is moving configuration items Same as above... } } */ class GuiDao { constructor(args) { this.viewer = args.viewer; / / cesium viewer enclosing our lineWidth = args. Our lineWidth | | 5. This.optionout = args. Out; // This. OptionIn = args. // This. Postype = args.postype; / / judgment into orbit coordinate point type/rails/completion of coordinate point spread array types if (this. Postype = = "array") {let pos = this. OptionOut. Positions. The slice (); this.guidaoOut = []; for (let i = 0; i < pos.length; i++) { this.guidaoOut.push(new Cesium.Cartesian3.fromDegrees(pos[i][0], pos[i][1], pos[i][2])); } }else{ this.guidaoOut = this.optionOut.positions.slice() || []; / rails/coordinate points out, the default is null} / / track the moving coordinate point spread array types if (this. Postype = = "array") {let pos = this. OptionIn. Positions. The slice (); this.guidaoIn = []; for (let i = 0; i < pos.length; i++) { this.guidaoIn.push(new Cesium.Cartesian3.fromDegrees(pos[i][0], pos[i][1], pos[i][2])); } }else{ this.guidaoIn = this.optionIn.positions.slice() || []; } this.entityOut = null; // Entity this.entityIn = null; // Entity this.guidaoInterval = null; // Delete this.init(); } // test() {let ci = 0; for (var i = 0; i < 2; I++) {enclosing guidaoOut. Push (new Cesium. Cartesian3. FromDegrees (ci, 0, 4000000)), ci + = 0.01} for (var I = 0; i < 100; I++) {enclosing guidaoIn. Push (new Cesium. Cartesian3. FromDegrees (ci, 0, 4000000)), ci + = 0.01} this. The init (); this.guidaoInterval = setInterval(() => { this.next(); }, 33)} // initialize the orbit init() {// determine if the orbit has finished running more than 2 coordinates, New if (this.guidaoout.length >= 2) {this.entityOut = this.createGuidaoOut (); This.entityin = this.createGuidaoin (); } // Go to the next orbital point next() {if (! this.guidaoIn.length) return; This.guidaoout.push (this.guidaoin.shift ())); If (this.guidaoout. length == 2) {this.entityOut = this.createGuidaoOut (); } // If the number of coordinates is less than 2, Delete the if (this. GuidaoIn. Length < 2) {. This viewer. Entities. Remove (enclosing entityIn)}} / / reset reset (args) {this. Destroy (); this.viewer = args.viewer; / / cesium viewer enclosing our lineWidth = args. Our lineWidth | | 5. This.optionout = args. Out; // This. OptionIn = args. / / rail will drive configuration items enclosing guidaoOut = this. OptionOut. Positions | | []; Rails / / coordinate points out, the default is empty this. GuidaoIn = this. OptionIn. Positions | | []; // This. EntityOut = null; // Entity this.entityIn = null; // Entity this.guidaoInterval = null; this.init(); } // Destroy () {// Use the test method to initialize, comment out; If (this.guidaoInterval) {clearInterval(this.guidaoInterval); this.guidaoInterval = null; } // remove entity, To add this. Viewer. Entities. Remove (enclosing entityOut) enclosing viewer. Entities. Remove (enclosing entityIn)} / / create on track CreateGuiDaoOut () {return this. The viewer. Entities. Add ({name: enclosing optionOut. Name | | - "drive" rail line, polyline: {positions: new Cesium.CallbackProperty(() => { return this.getOutPos(); }, false), material: this.optionOut.color || new Cesium.Color(1, 0, 0, 1), width: this.lineWidth, }, }); } / / create the moving orbit createGuiDaoIn () {return this. The viewer. Entities. Add ({name: enclosing optionIn. Name | | "rail line - is driving", polylines, { positions: new Cesium.CallbackProperty(() => { return this.getInPos(); }, false), material: this.optionIn.color || new Cesium.Color(0, 1, 0, 1), width: this.lineWidth, }, }); } getOutPos() {return this.guidaoout; } getInPos() {return this.guidaoin; } setOutPos(pos) {this.guidaoOut = pos; } setInPos(pos) {this.guidaoIn = pos; } // Get identity of entity getOutEntity() {return this.entityOut; } // get the upcoming track entity getInEntity() {return this.entityin; }}Copy the code