Android Question Help in Parsing Weather Json and showing it on label

[RushilD]

Hello,

I need a small help or an example. I have a small section in my App where I want to show the live Weather plus weather conditions for the next 3 days. I am using accuweather for this.

I am getting the following json data response.

{
    "Headline": {
        "EffectiveDate": "2022-08-15T08:00:00+02:00",
        "EffectiveEpochDate": 1660543200,
        "Severity": 5,
        "Text": "A thunderstorm Monday",
        "Category": "thunderstorm",
        "EndDate": "2022-08-15T20:00:00+02:00",
        "EndEpochDate": 1660586400,
        "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?unit=c&lang=en-us",
        "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?unit=c&lang=en-us"
    },
    "DailyForecasts": [
        {
            "Date": "2022-08-11T07:00:00+02:00",
            "EpochDate": 1660194000,
            "Temperature": {
                "Minimum": {
                    "Value": 16.1,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.1,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 2,
                "IconPhrase": "Mostly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=1&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=1&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-12T07:00:00+02:00",
            "EpochDate": 1660280400,
            "Temperature": {
                "Minimum": {
                    "Value": 17.5,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.3,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 1,
                "IconPhrase": "Sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=2&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=2&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-13T07:00:00+02:00",
            "EpochDate": 1660366800,
            "Temperature": {
                "Minimum": {
                    "Value": 18.3,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.1,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 2,
                "IconPhrase": "Mostly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=3&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=3&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-14T07:00:00+02:00",
            "EpochDate": 1660453200,
            "Temperature": {
                "Minimum": {
                    "Value": 19.9,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 29.3,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 3,
                "IconPhrase": "Partly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 36,
                "IconPhrase": "Intermittent clouds",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=4&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=4&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-15T07:00:00+02:00",
            "EpochDate": 1660539600,
            "Temperature": {
                "Minimum": {
                    "Value": 16.6,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 23.9,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 4,
                "IconPhrase": "Intermittent clouds",
                "HasPrecipitation": true,
                "PrecipitationType": "Rain",
                "PrecipitationIntensity": "Moderate"
            },
            "Night": {
                "Icon": 35,
                "IconPhrase": "Partly cloudy",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=5&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=5&unit=c&lang=en-us"
        }
    ]
}

Using the https://b4x.com:51041/json/index.html

I get the following output:

Dim parser As JSONParser
parser.Initialize(<text>)
Dim jRoot As Map = parser.NextObject
Dim Headline As Map = jRoot.Get("Headline")
Dim Category As String = Headline.Get("Category")
Dim EndEpochDate As Int = Headline.Get("EndEpochDate")
Dim EffectiveEpochDate As Int = Headline.Get("EffectiveEpochDate")
Dim Severity As Int = Headline.Get("Severity")
Dim Text As String = Headline.Get("Text")
Dim EndDate As String = Headline.Get("EndDate")
Dim Link As String = Headline.Get("Link")
Dim EffectiveDate As String = Headline.Get("EffectiveDate")
Dim MobileLink As String = Headline.Get("MobileLink")
Dim DailyForecasts As List = jRoot.Get("DailyForecasts")
For Each colDailyForecasts As Map In DailyForecasts
 Dim Temperature As Map = colDailyForecasts.Get("Temperature")
 Dim Minimum As Map = Temperature.Get("Minimum")
 Dim UnitType As Int = Minimum.Get("UnitType")
 Dim Value As Double = Minimum.Get("Value")
 Dim Unit As String = Minimum.Get("Unit")
 Dim Maximum As Map = Temperature.Get("Maximum")
 Dim UnitType As Int = Maximum.Get("UnitType")
 Dim Value As Double = Maximum.Get("Value")
 Dim Unit As String = Maximum.Get("Unit")
 Dim Night As Map = colDailyForecasts.Get("Night")
 Dim HasPrecipitation As String = Night.Get("HasPrecipitation")
 Dim IconPhrase As String = Night.Get("IconPhrase")
 Dim Icon As Int = Night.Get("Icon")
 Dim EpochDate As Int = colDailyForecasts.Get("EpochDate")
 Dim Day As Map = colDailyForecasts.Get("Day")
 Dim HasPrecipitation As String = Day.Get("HasPrecipitation")
 Dim IconPhrase As String = Day.Get("IconPhrase")
 Dim Icon As Int = Day.Get("Icon")
 Dim Sources As List = colDailyForecasts.Get("Sources")
 For Each colSources As String In Sources
 Next
 Dim Date As String = colDailyForecasts.Get("Date")
 Dim Link As String = colDailyForecasts.Get("Link")
 Dim MobileLink As String = colDailyForecasts.Get("MobileLink")
Next

I am not sure how to use the above as I would like to parse the data separately and then show them on labels as Day 1, Day 2 and Day 3 etc as shown in the below image

 

[DonManfred]

as I would like to parse the data separately

you have to extract the data whereever you need them.

For Each colDailyForecasts As Map In DailyForecasts

you need to use the data in that loop to create the daily forecasts...

or Each colDailyForecasts As Map In DailyForecasts
 Dim Temperature As Map = colDailyForecasts.Get("Temperature")
 Dim Minimum As Map = Temperature.Get("Minimum")
 Dim UnitType As Int = Minimum.Get("UnitType")
 Dim Value As Double = Minimum.Get("Value")
 Dim Unit As String = Minimum.Get("Unit")
 Dim Maximum As Map = Temperature.Get("Maximum")
 Dim UnitType As Int = Maximum.Get("UnitType")
 Dim Value As Double = Maximum.Get("Value")
 Dim Unit As String = Maximum.Get("Unit")
 Dim Night As Map = colDailyForecasts.Get("Night")
 Dim HasPrecipitation As String = Night.Get("HasPrecipitation")
 Dim IconPhrase As String = Night.Get("IconPhrase")
 Dim Icon As Int = Night.Get("Icon")
 Dim EpochDate As Int = colDailyForecasts.Get("EpochDate")
 Dim Day As Map = colDailyForecasts.Get("Day")
 Dim HasPrecipitation As String = Day.Get("HasPrecipitation")
 Dim IconPhrase As String = Day.Get("IconPhrase")
 Dim Icon As Int = Day.Get("Icon")
 Dim Sources As List = colDailyForecasts.Get("Sources")
 For Each colSources As String In Sources
 Next
 Dim Date As String = colDailyForecasts.Get("Date")
 Dim Link As String = colDailyForecasts.Get("Link")
 Dim MobileLink As String = colDailyForecasts.Get("MobileLink")
  ' Work with the data from this day.....
Next

 

[RushilD]

you have to extract the data as you bneed them.


you need to use the data in that loop to create the daily forecasts...

Do you have any small example ? or snippet how I could do this ?

How I could increment it etc. Would be very helpful

 

[DonManfred]

Do you have any small example ?

i already posted it. Do not expect me writing your code.
You get the correct code already from the jsontool. I highlighted just the correct line (added a comment) for you to add your code there. It is up to you to understand how the code is working and what you get (add log to see the values in the loop)

All you need is to understand the code and use the variables you get in the loop to fill your label(s).

 

[Alexander Stolte]

Instead of using the date, use the "EpochDate", this can be more easily converted to ticks and made into the day name of the week.

    Dim jRoot As Map = parser.NextObject
    Dim DailyForecasts As List = jRoot.Get("DailyForecasts")
    For Each colDailyForecasts As Map In DailyForecasts

        Dim Date As Long = DateUtils.UnixTimeToTicks(colDailyForecasts.Get("EpochDate")) 'The Date in Ticks

        Log(DateUtils.TicksToString(Date)) 'Ticks to string
        Log(DateUtils.GetDayOfWeekName(Date)) 'Weekday Name

    Next

 

[aeric]

You need to look for interesting "keywords"
I think it is more easier to visualize the JSON using the right panel with treeview.
Look inside the "DailyForecasts". It shows data starting from Day index = 0 to index = 4.

As mentioned by Alexander above, you can make use of "EpochDate" for the date.
For Temperature, I think the Maximum value is more interesting for Day time. Minimum value is for Night time.
For the icons number, check their documentation: https://developer.accuweather.com/weather-icons
You can use your own icons or load the image from the image source. You can also use the Text map to that icon number.

 

[RushilD]

Thank you for the replies and input. I am actually struggling to understand how to parse the FOR EACH LOOP in the json parser ? and store and update the day, temperature labels one by one.

 

[Andrew (Digitwell)]

What have you tried?
How did it work?
A lot of programming is trail and error.

 

[RushilD]

What have you tried?
How did it work?
A lot of programming is trail and error.

I am able to update only 1 label. Not sure how to parse and load the other two labels

 

[Andrew (Digitwell)]

upload you code or a sample with the problem.

 

[aeric]

I am able to update only 1 label. Not sure how to parse and load the other two labels

You need to understand the basic how For loop works.
If you don’t understand, please go through B4X guide

https://www.b4x.com/guides/B4XBasicLanguage/?page=57

You also need to understand how to use If-Then-Else to control the flow.

https://www.b4x.com/guides/B4XBasicLanguage/?page=51

The pseudocode will look like this:

Dim Index As Int
For Each item in Items
    Index = Index + 1
    If Index = 1 Then
        Label1.Text = Temperature
    Else If Index = 2 Then
        Label2.Text = Temperature
    Else If Index = 3 Then
        Label3.Text = Temperature
    End If
Next

 

[Alexander Stolte]

End For Each

For Each

Next

 

[rwblinn]

Scribbled an example B4XPages project - tested with B4J (only) - see attached.
The JSON test data provided in post #1 is parsed to show the 5 day forecast.
Each day is created with views and added to a pane.
The icons are downloaded from AccuWeather via resumable sub.

Give a go and test with B4A ... Good Luck.