How to Extract data based on the values in one array after matching the corresponding values from another array in JavaScript?

Question

This is the URL from GeoServer to get feature info

{"type":"FeatureCollection","features":[{"type":"Feature","id":"weather_warning_day_1.fid--418ec0da_178b69d5dfc_-715c","geometry":null,"properties":{"issue_date":"2021-04-09","updated_at":"2021-04-09T09:26:33+05:30","utc_time":0,"state_name":"Odisha","state_id":21,"district_name":"MAYURBHANJ","district_id":232,"api_district_name":"MAYURBHANJ","day_1":"6,9,10","day1_color":3}}],"totalFeatures":"unknown","numberReturned":1,"timeStamp":"2021-04-09T15:38:19.536Z","crs":null}

the data I want to extract is of variable: "day_1":"6,9,10" which I got from the layer and stored it in the variable as

var warning_day_1 = weather_warning_layer_data.features[0].properties.day_1

so basically the input is "day_1":"6,9,10" which I have stored in the array as

[{"warning":"6"},{"warning":"9"},{"warning":"10"}]

and corresponding output should be Dust Storm, Heat Wave, Hot Day

Dust Storm, Heat Wave, Hot Day

or if the input was "day_1":"2,5" then output should have been Heavy Rain, Hailstorm

or if the input was "day_1":"1" then output should have been No Warning

After reading the data of the string and creating its array, I have to compare it with another array and extract the key values (display) corresponding to the key values (warning) in the 1st array.

var warning_data_split = warning_day_1.split(/[ ,]+/);
var warning_data_from_api_array = new Array;
warning_data_from_api_array.push(warning_data_split);


for (var i = 0; i < warning_data_from_api_array.length; i++) {
var item_in_array_to_compare = warning_data_from_api_array[i];
if(warning_data_from_api_array[item_in_array_to_compare.warning_data_from_api_array])
{warning_data_from_api_array[item_in_array_to_compare.warning_data_from_api_array].push(item_in_array_to_compare);} 
else {
warning_data_from_api_array[item_in_array_to_compare.warning_data_from_api_array] = [item_in_array_to_compare];}}

let final_array_to_compare = item_in_array_to_compare
final_array_to_compare = final_array_to_compare.map(x => ({warning: x})); 
/// this is the first array ////////////

The values in this array are not static in length, as it keeps on changing like, sometimes the array has value [1] or [1,2], [2,5,8], [4,7,12], etc so I have to extract the corresponding values of display from the lookup array given below

var warning_code_meaning_list = [
{ warning:"1", display:"No Warning"}, 
{ warning:"2", display:"Heavy Rain"}, 
{ warning:"3", display:"Heavy Snow"}, 
{ warning:"4", display:"Thunderstorm & Lightning, Squall etc"},  
{ warning:"5", display:"Hailstorm"},
{ warning:"6", display:"Dust Storm"},
{ warning:"7", display:"Dust Raising Winds"},
{ warning:"8", display:"Strong Surface Winds"},
{ warning:"9", display:"Heat Wave"},
{ warning:"10", display:"Hot Day"},
{ warning:"11", display:"Warm Night"},
{ warning:"12", display:"Cold Wave"},
{ warning:"13", display:"Cold Day"},
{ warning:"14", display:"Ground Frost"},
{ warning:"15", display:"Fog"}
]

The data which I am getting in warning_day_1 (in the very first line of the code) is a string (this couldn’t be saved as float/integer in the database column because sometimes there are more than 1 warning for a specific place, so I have stored this as a text in the database) Which I’m converting to an array after reading it from the API

Now this string, which I am fetching from API has variable data, Some time single digit like: 1 Sometime multiple : 1,2,3

And each of the integer present in this array corresponds to the specific text shown in the next array like if the warning is 2 it means the heavy rainfall, but if the string (later converted to an array, with “warning” as a key) has 2,5 as value, it means: heavy rainfall & Hailstorm

I want that the values which come up in array 1 (the dynamic one) got match with the 2nd array ( a sort of lookup array) and fetch its display value as output.

How to do so?

I don't know, What you are trying to do...It would be helpful If I know the Inputs, And what is your expected output would be ? — Nur, Apr 09 '21 at 13:32
@Nur I have updated the question, I hope it is somewhat clear now — Abhilash Singh Chauhan, Apr 09 '21 at 15:14
I can't tell much about your code implementation, Because It doesn't make any sense to me ,So I will write you a function, But first I need the input or inputs, and what is your expected output would be like ? [Check out this question style](https://stackoverflow.com/questions/67012211/in-javascript-is-there-a-way-to-sum-elements-in-multi-dimensional-arrays-groupe) In this question it has input and expected output, — Nur, Apr 09 '21 at 15:51
Thanks much understandable, But do you need specific output style, Like: `Dust Storm, Heat Wave, Hot Day ,` note there is a Trailing comma, is that ok to have a Trailing comma in last item? — Nur, Apr 09 '21 at 16:12
because computer has to do some kind of check, if is last element then no Trailing comma, else Trailing comma... So need more computation power — Nur, Apr 09 '21 at 16:14
@Nur The comma will be needed to separate the different values, Trailing comma will not be required. I am sorry if I have put this in the code above. — Abhilash Singh Chauhan, Apr 09 '21 at 16:15
Note that, If you use `warning_code_meaning_list ` as a map, It would more efficient, if we just lookup map object — Nur, Apr 09 '21 at 16:23
use @lnogueir answer, and map his result like so, `results.map(arr => arr.join(', '))` where `results` is `[ [ 'Dust Storm', 'Heat Wave', 'Hot Day' ] ]`, — Nur, Apr 09 '21 at 16:46

score 1 · Accepted Answer · answered Apr 09 '21 at 16:19

You could use an object to map your warnings to messages.

Try this:

const data = {"type":"FeatureCollection","features":[{"type":"Feature","id":"weather_warning_day_1.fid--418ec0da_178b69d5dfc_-715c","geometry":null,"properties":{"issue_date":"2021-04-09","updated_at":"2021-04-09T09:26:33+05:30","utc_time":0,"state_name":"Odisha","state_id":21,"district_name":"MAYURBHANJ","district_id":232,"api_district_name":"MAYURBHANJ","day_1":"6,9,10","day1_color":3}}],"totalFeatures":"unknown","numberReturned":1,"timeStamp":"2021-04-09T15:38:19.536Z","crs":null}
var warning_code_meaning_list = {
  "1":"No Warning",
  "2":"Heavy Rain",
  "3":"Heavy Snow",
  "4":"Thunderstorm & Lightning, Squall etc", 
  "5":"Hailstorm",
  "6":"Dust Storm",
  "7":"Dust Raising Winds",
  "8":"Strong Surface Winds",
  "9":"Heat Wave",
  "10":"Hot Day",
  "11":"Warm Night",
  "12":"Cold Wave",
  "13":"Cold Day",
  "14":"Ground Frost",
  "15":"Fog",
};

results = data["features"].map(feature => {
  return feature.properties.day_1.split(',').map(code => {
    return warning_code_meaning_list[code];
  });
});

That gives you an array of arrays of the displays:

[ [ 'Dust Storm', 'Heat Wave', 'Hot Day' ] ]

How to Extract data based on the values in one array after matching the corresponding values from another array in JavaScript?

1 Answers1