FIG cesium wind effects achieved (with source download)

Foreword

api documentation cesium official website Address cesium official website api , description of each class of which a detailed description cesium, there is the online examples: cesium official website online examples , this is a good learning material cesium.

At a Glance

1. FIG wind implemented based cesium effect
2. download the source code demo

FIG Benpian achieve cesium wind function, the effect is as follows:

Realization of ideas:

  • Field data acquisition sources:
    weather data generated by the Global Forecast System (GFS), managed by the National Weather Service. Forecast to produce four times a day, it can be used to download from the NOMADS. These files are located GRIB2 format and contains more than 300 records. We only need a small fraction of these records can be visualized in specific wind data such as pressure line. The following command download 1000 hPa wind vector, using grib2json convert them to JSON format.
  • Generating a series of random locations on the screen and draw particles are particles
  • For each particle, the wind query data to obtain a particle velocity of its current position, and accordingly it moves
  • A small portion of the particles is reset to a random location. This ensures that the wind never become empty area
  • Fade out the current screen, and draw new particles positioned at the top

Core code

  • Wind farm map initialization call
function the Draw () { 
$ .ajax ({ 
type: "GET" , 
URL: "sampleData / Wind / gfs20171227.json", // request data source wind JSON 
dataType: "JSON" , 
Success: function (Response) {
 var = Response header [0 ] .header; 
Windy = new new Windy (Response, Viewer); 
the redraw (); 
}, 
error: function (errorMsg) { 
Alert ( "request data failed. 1!" ); 
} 
}); 
} 
 
var Timer = null ;
 // loading FIG wind 
the Draw ();
 function redraw() {
timer = setInterval(function () {
windy.animate();
}, 300);
}
  • Windy wind farm
var _primitives = null;
var SPEED_RATE = 0.15;
var PARTICLES_NUMBER =2000;//默认2000
var MAX_AGE = 10;
var BRIGHTEN = 1.5;
 
var Windy = function (json, cesiumViewer) {
this.windData = json;
this.windField = null;
this.particles = [];
this.lines = null;
_primitives = cesiumViewer.scene.primitives;
this._init();
};
Windy.prototype = { 
constructor: Windy, 
the _init: function () {
 // create a wind farm grid 
the this .windField = the this .createField ();
 // Create wind particles 
for ( var I = 0; I <PARTICLES_NUMBER; I ++ ) {
 the this .particles.push ( the this .randomParticle ( new new Particle ())); 
} 
}, 
......

For more details, see the following article in the link :

GIS small column of this article: cesium achieve the effect of the wind field maps (with source code download)

Article provides source code, are interested in this column, you can focus on a wave

Guess you like

Origin www.cnblogs.com/giserhome/p/11449213.html