Wind farm visualization: wind farm data

Introduction

understand WebGL Basics after , Next, let's look at the logic of obtaining and analyzing wind farm data , I have another problem .

System ：MacOS
edition ：11.6
Origin
My GitHub

install ecCodes

In the article Sample source library In the description of , First install ecCodes , Try to use HomeBrew But not . So I followed ecCodes The introduction of the source library is compiled and installed locally .

In progress 4 When you walk , There's a problem ：

No CMAKE_Fortran_COMPILER could be found.

The inquiry said that it was lack of gfortran , You can use the command to see if... Is installed ：

which gfortran

There are several kinds. Installation mode , I choose Download installation package .

After solving this problem, follow the instructions to continue , Compile and install successfully , The version is 2.23.0 .

Execute the script

When executing a script , An error message appears ：

grib_set: command not found grib_dump: command not found

But in the previously installed folder bin Under the directory, I found grib_set The executive documents of . The inference is that it is not registered in the global path .

see ecCodes Whether the installation path is registered in the global path ：

echo $PATH

The problem here is that it is not registered in the global path , Please refer to here .

Modification example ：

vim ./.bash_profile

Once you're in edit mode , Add the following ：

export ECCODE_HOME=/xx/xx/xx/xx/eccodesbuild/bin
export PATH=$PATH:$ECCODE_HOME

After the save , Make it effective

source ./.bash_profile

Want to know if it's in effect , Try the command grib_set -h , If it doesn't work , It is possible to use shell Terminal correlation , For reference. here .

The data generated

The script can be executed normally , But the data generated is wrong ：

undefined:1
{"u":,"v":}

View the source library issues , Someone inside also mentioned this problem , Tried some of the methods inside , Found this pull The modification can work normally . So he fork After a while, I got the modified content , Changed some data , see XXHolic/webgl-wind .

Data meaning

stay download.sh Script , After obtaining the data and parsing , Generate readable files tmp.json , Let's take a look at the main structure and some data in this file ：

{
  "u":{
    "messages" : [
      [
        {
          "key" : "name",
          "value" : "U component of wind"
        },
        {
          "key" : "Ni",
          "value" : 360
        },
        {
          "key" : "Nj",
          "value" : 181
        },
        {
          "key" : "values",
          "value" : [5.51964, 5.71964, ...]
        },
        {
          "key" : "maximum",
          "value" : 103.02
        },
        {
          "key" : "minimum",
          "value" : -36.0804
        }
      ]
    ]
  },
  "v":{
    "messages" : [
      [
        {
          "key" : "name",
          "value" : "V component of wind"
        },
        {
          "key" : "getNumberOfValues",
          "value" : 65160
        },
        {
          "key" : "values",
          "value" : [14.9446, 14.8446, ...]
        },
        {
          "key" : "maximum",
          "value" : 80.3446
        },
        {
          "key" : "minimum",
          "value" : -66.4554
        }
      ]
    ]
  }
}

There may be some doubts when you see these , The air flow in the atmosphere has both speed and direction , Mathematically, it can be represented by a vector . In meteorology , If you know the direction and size of the wind , You can get the vector representing the wind ,u Weight and v component ：

// ws  Wind size  θ  The direction of the wind in Mathematics 
u = ws * cos(θ)
v = ws * sin(θ)

97-1

For a more detailed introduction, see Wind: u and v Components .

And then prepare.js Used in wind data key Yes ：

Ni Indicates how many points there are on a weft line , Simply put, how many columns .
Nj Indicates how many points there are on a meridian , Simply put, how many lines there are .
values Store all the values of the component .
minimum Represents the minimum value of the component .
maximum Represents the maximum value of the component .

among Ni and Nj Determines the width and height of the generated image , The main logic of the color corresponding to the wind speed mapping is as follows ：

for (let y = 0; y < height; y++) {
  for (let x = 0; x < width; x++) {
    const i = (y * width + x) * 4;
    const k = y * width + ((x + width / 2) % width);
    png.data[i + 0] = Math.floor(
      (255 * (u.values[k] - u.minimum)) / (u.maximum - u.minimum)
    );
    png.data[i + 1] = Math.floor(
      (255 * (v.values[k] - v.minimum)) / (v.maximum - v.minimum)
    );
    png.data[i + 2] = 0;
    png.data[i + 3] = 255;
  }
}

i ： Used pngjs plug-in unit , Color usage RGBA Pattern , Every successive... In the array 4 A location stores the color value of a point , therefore i If the variable is 4 Multiple .
k ： The index used to get the wind speed , Have a look first y=0 when ,k The value of changes from 180 -> 359 Increasing , And then from 0 -> 179 Increasing , So start from the middle , The guess is that the display map is a two-dimensional world map , The returned data is the corresponding rule .
How to map ： With maximum - minimum As a benchmark , Then calculate the relative value of wind speed values[k] - minimum , The ratio of the two values is multiplied by the maximum value of the color component 255 .