Displaying API results in Google Chart

Dear team,

I am very impressed by AppGyver so far and the community here has been very useful when I was looking for answers, so keep up the good work!

I intend to grab weather data (using the openweathermap using their new One Call API) and display this data in a Google Chart. I am retrieving a record succesfully but now I need to “parse” this input into a format accepted by Google Charts (ChartData (array of arrays) page variable). It should look like this: [[“Date/Time”,“Actuals”,“Forecast”][14:00, 10, 12][15:00, 8, 10]etc.]

My thought was to set the ChartData page variable using a MAP formula to achieve this. Example:

[[‘Date/Time’, ‘Actuals’, ‘Forecast’],MAP(data.OpenWeatherOneCall.hourly, item.dt)]

would lead to: [[“Date/Time”,“Actuals”,“Forecast”][14:00, 15:00, 16:00]] but that only gives me the first item in the array (date/time). But how do I get the other items in this formula when iterating through the array? I have tried MERGE, but that doesn’t seem to work.

Thanks for your help!

Cheers, Maarten

Here’s example output from openweatherdata:
{
“lat”: 52,
“lon”: 5,
“timezone”: “Europe/Amsterdam”,
“timezone_offset”: 7200,
“current”: {
“dt”: 1593002993,
“sunrise”: 1592968844,
“sunset”: 1593029047,
“temp”: 301.86,
“feels_like”: 302.88,
“pressure”: 1020,
“humidity”: 46,
“dew_point”: 289.1,
“uvi”: 7.28,
“clouds”: 39,
“wind_speed”: 1.34,
“wind_deg”: 74,
“wind_gust”: 4.47,
“weather”: [
{
“id”: 802,
“main”: “Clouds”,
“description”: “scattered clouds”,
“icon”: “03d”
}
]
},
“hourly”: [
{
“dt”: 1593000000,
“temp”: 301.86,
“feels_like”: 301.04,
“pressure”: 1020,
“humidity”: 46,
“dew_point”: 289.1,
“clouds”: 39,
“wind_speed”: 3.97,
“wind_deg”: 96,
“weather”: [
{
“id”: 802,
“main”: “Clouds”,
“description”: “scattered clouds”,
“icon”: “03d”
}
]
},
{
“dt”: 1593003600,
“temp”: 301.15,
“feels_like”: 300,
“pressure”: 1021,
“humidity”: 47,
“dew_point”: 288.8,
“clouds”: 68,
“wind_speed”: 4.27,
“wind_deg”: 93,
“weather”: [
{
“id”: 803,
“main”: “Clouds”,
“description”: “broken clouds”,
“icon”: “04d”
}
]
},
{
“dt”: 1593007200,
“temp”: 300.72,

If I understood correctly, you can just use MAP. It allows you to create objects and arrays of values also.

Try something like MAP(data.OpenWeatherOneCall.hourly, [item.dt, item.temp, item.feels_like]) or as objects MAP(data.OpenWeatherOneCall.hourly, {dt: item.dt, temp: item.temp, feels_like: item.feels_like})

Thanks Tomi for your ridiculously fast response! That might just be it. But when I try to enter the second item (item.temp), the entire Appgyver website freezes… This has happened to me a few times already. Any idea what’s happening? I can reproduce this every time… I also tried to remove the formula and copy paste it from Notepad, but still the entire Composer freezes…

Thanks, Maarten

Umm… Sounds odd and I cannot think of a reason for this to happen.

Would you like to you give me your app id so I could take a look at this myself? (You can find the app id in the app url https://platform.appgyver.com/builder/applications/12345 where 12345 is the id)

Hi Tomi, sure! ID is 99343.

It’s the Google Charts Example page and the Set page variable is triggered when you push the button.

I tested this and all worked well for me. I was able to change the formula any way I liked without any issues.

If this happens to you again and you can reproduce the issue, could you write down the exact steps you took to make the page freeze or perhaps record your screen?

Hi Tomi,

When I go to the Google Charts Example page, I click on the button, set page variable and edit the formula. In the formula editor, I add a bracket before item.dt add a comma after item.dt and try to enter item.wind_speed, it hangs. I can reproduce it every time. I have also tried to add the 2 brackets later, but when I try to type the second bracket it also hangs.

I can do a screen recording if that helps, but can you recommend screen recording software?

Thanks again!

I tried those steps and all worked well again. So yeah, screen recording would be good. I personally use https://monosnap.com/

Thanks, screenrecording can be downloaded here: https://we.tl/t-6tNyzXHk8L

Thanks! I was able to repro the issue now. That’s bizarre… We will dig in to the issue here and will notify you when the issue is fixed.

I found a bit odd workaround for you to use meanwhile.

  1. First write what you need without the array brackets, e.g. [['Date/Time', 'Actuals', 'Forecast'],MAP(data.OpenWeatherOneCall.hourly, item.dt, item.wind_speed)]
  2. Then add the closing bracket: [['Date/Time', 'Actuals', 'Forecast'],MAP(data.OpenWeatherOneCall.hourly, item.dt, item.wind_speed])]
  3. Lastly add the opening bracket: [['Date/Time', 'Actuals', 'Forecast'],MAP(data.OpenWeatherOneCall.hourly, [item.dt, item.wind_speed])]

It looks to me that you can save the changes this way while we work on the bug.

Hi Tomi, I had actually thought of this workaround and tried it before, but it also hangs Composer… It does work for 2 variables (as you describe in your example), but the array requires 3 variables. Any other possible workarounds you can think of? Otherwise I will wait for the bug fix. Thanks again for all your help!

Hi @Maarten_Beekman! Thanks to you, we have identified a bug in Composer that causes this freeze! This situation happens when there is a lot of example data saved to a data resource (in your case OpenWeatherOneCall) and when the Composer’s formula editor tries to tell you examples of the possible outcomes of the formula. There was a severe performance issue there, which we will fix in the next update!

Meanwhile, there is one trick that you can do to avoid this issue:

  1. open “Data”
  2. select “OpenWeatherOneCall” resource
  3. open “Get record (GET)”
  4. select “Schema” tab
  5. select “hourly” property
  6. on the right, under “Example values” heading, remove most of the example objects (you can see there is a huge number of them) by repeatedly clicking the remove icon. You can leave a couple of them so that formula editor can still show you example results.

Hi Kimmo,

I removed almost all example values, saved it, even reset the but it still hangs when I try to add the parameter to the formula…

Thanks, Maarten