Generate a JavaScript variable in real-time and leverage it to retrieve the corresponding JSON response

Question

Generate a JavaScript variable in real-time and leverage it to retrieve the corresponding JSON response

After receiving a JSON response from an API as depicted in the image below: https://i.sstatic.net/5eq43.png

I encountered an issue where the same column_code is used in both the variable_meta section and the data part of the response. This column code acts as the variable name for fetching time-series data, leading to confusion on how to obtain the data in this scenario.

I attempted employing the window method but faced difficulties with its implementation. In the code snippet provided, my objective is to dynamically replace the utilization of FRWRTM_AirT_2_2_A with a programmatically generated variable.

if( x[i].FRWRTM_AirT_2_2_A !=-9999) {
      d = new Date(x[i].date_UTC)
      y.push([d, x[i].FRWRTM_AirT_2_2_A])
      //console.log(d, x[i].FRWRTM_AirT_2_2_A)
    }

Edit : Including the JSON response requested by some:

{
    "meta_data": {
        "station_meta": [
            {
                "city": "xxx",
                "station": "yyy",
                "lat": 58.992778,
                "lon": 15.844722,
                "height": 277,
                "landcover": "Artificial Surfaces"
            }
        ],
        "variable_meta": [
            {
                "city": "xxx",
                "station": "yyy",
                "variable": "Air Temperature",
                "variable_logger_name": "CS215_AirTemperature_degC_Avg",
                "height": 2,
                "aggregation": "A",
                "level": 2,
                "unit": "ºC",
                "column_code": "FRWRTM_AirT_2_2_A"
            },
            {
                "city": xxx",
                "station": "yyy",
                "variable": "Air Temperature",
                "variable_logger_name": "CS215_AirTemperature_degC_Min",
                "height": 2,
                "aggregation": "I",
                "level": 2,
                "unit": "ºC",
                "column_code": "FRWRTM_AirT_2_2_I"
            },
            {
                "city": "xxx",
                "station": "yyy",
                "varible": "Air Temperature",
                "variable_logger_name": "CS215_AirTemperature_degC_Max",
                "height": 2,
                "aggregation": "X", 
                "level": 2,
                "unit": "ºC",
                "column_code": "FRWRTM_AirT_2_2_X"
            }         
        ]
    },
    "data": [
        {
            "date_UTC": "2018-05-14 11:00:01",
            &fracr;FRWRTM_AirT_2_2_A": -9999,
            "FRWRTM_AirT_2_2_I": -9999,
            "FRWRTM_AirT_2_2_X": -9999
        },
        {   
            "date_UTC"::"2018-05-14 12:00:01",,
            "FRWRTM_AirT_2_2_A": -9999
            "FRWRTM_AirT_2_2_I"": -9999,
            "FWRTM_Airt_2_2_x".: -9999     
        },   ]
}

javascript json

Answer 1

Answer №1

Is this the data you are seeking?

let response = DATA_FROM_FETCH_REQUEST; // { meta_data: ..., data: ... }
let column_name = response.meta_data.variable_meta[0].column_name;
let column_value = response.data[0][column_name];

if(x[i][column_value] !=-9999) {
  d = new Date(x[i].date_UTC)
  y.push([d, x[i].FRWRTM_AirT_2_2_A])
  //console.log(d, x[i].FRWRTM_AirT_2_2_A)
}

Answer 2

Is this the data you are seeking?

let response = DATA_FROM_FETCH_REQUEST; // { meta_data: ..., data: ... }
let column_name = response.meta_data.variable_meta[0].column_name;
let column_value = response.data[0][column_name];

if(x[i][column_value] !=-9999) {
  d = new Date(x[i].date_UTC)
  y.push([d, x[i].FRWRTM_AirT_2_2_A])
  //console.log(d, x[i].FRWRTM_AirT_2_2_A)
}

Answer 3

Answer №2

To retrieve an array containing all the column_code values from the 3 elements within the variable_meta array, follow these steps:

const columnValues = yourData.meta_data.variable_meta.map(vm => vm.column_code);

Next, based on how you want to structure your data, loop through your data and the columnValues array as shown below:

const filteredFields = columnValues.map(cv => 
  yourData.data.filter(d => 
    (d[cv] || d[cv] === 0) && d[cv] != -9999
  ).map(d => 
    [new Date(d.date_UTC), d[cv]]
  )
);

Answer 4

To retrieve an array containing all the column_code values from the 3 elements within the variable_meta array, follow these steps:

const columnValues = yourData.meta_data.variable_meta.map(vm => vm.column_code);

Next, based on how you want to structure your data, loop through your data and the columnValues array as shown below:

const filteredFields = columnValues.map(cv => 
  yourData.data.filter(d => 
    (d[cv] || d[cv] === 0) && d[cv] != -9999
  ).map(d => 
    [new Date(d.date_UTC), d[cv]]
  )
);

Generate a JavaScript variable in real-time and leverage it to retrieve the corresponding JSON response

Answer №1

Answer №2

Similar questions

Issue with ReactJS: onChange event does not function properly when value is changed using jQuery

Is it possible for me to verify the login status of an Auth0 user within my custom NextJS _app.js file?

Choose a specific <div> element from an external page using Ajax/PHP

Emberjs Troubleshooting: Issue with Sending Many-To-Many JSON Parameters

How about passing some vue props data over?

What is the best way to merge two approaches for tallying items within each category?

Discover the best way to retrieve XML information from various sources specifically designed for Windows gadgets using JavaScript

How do I retrieve the value of a class that is repeated multiple times?

Engaging with the crossrider sidepanel extension

Making a dropdown menu spin using Jquery and Javascript

"Automate the process of clicking on a specific part of a div element

Establish a React component to observe socket.io

Ensuring the existence of a MySQL database prior to executing a Node.js application

Serialize Jackson without including any properties

Encountered an Angular HPM localhost error while attempting to proxy a request for /api/books from localhost:4200 to http://localhost:3333

What is the best way to accurately determine an element's location after scrolling to it?

Handling Exceptions in Node.js and Express

Subheaders that stay in place while scrolling through a table with a stationary header

Elements from Firebase failing to appear in Angular Grid

Determine the data type of a string without needing to convert it