• Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript Need some help with JSON file data retrieval.

Shenphen

New Coder
Could someone please help an inexperienced hobby programmer. I have run into a small problem of parsing data from a remote JSON file, which contains several children. I always need to parse the top (first) child, since it is always the newest. I need the latitude and logitude to place them on a map. So I would like to use them with the Leaflet javascript library for OpenStreetMap. The JSON looks like this.

Code:
"response": {
        "feedMessageResponse": {
            "count": 3,
            "feed": {
                "id": "xxxxxxx",
                "name": "LH1",
                "description": "LH1",
                "status": "ACTIVE",
                "usage": 0,
                "daysRange": 7,
                "detailedMessageShown": true,
                "type": "SHARED_PAGE"
            },
            "totalCount": 3,
            "activityCount": 0,
            "messages": {
                "message": [
                    {
                        "@clientUnixTime": "0",
                        "id": 1788105577,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635998,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.8000,
                        "longitude": 12.3000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:53:18+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 35
                    },
                    {
                        "@clientUnixTime": "0",
                        "id": 1788105607,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635698,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.85000,
                        "longitude": 12.45000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:48:18+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 0
                    },
                    {
                        "@clientUnixTime": "0",
                        "id": 1788102790,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635450,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.9000,
                        "longitude": 12.5000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:44:10+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 41
                    }
                ]
            }
        }
    }
}


I would like for it to work in the following script, which I would like to use as my personal bicycle ride tracker on my website. But I am not sure how I can specify that it is the first child latitude and logitude, that are supposed to be tracked. The quoted section is the part, which needs some changes for it to work. The link to the Findmespot JSON, instead of the ISS position JSON, is as follows (my feed id has been removed in the JSON link): https://api.findmespot.com/spot-main-web/consumer/rest-api/2.0/public/feed/FEED_ID_HERE/message.json

Code:
       <script>
      // Making a map and tiles
      const mymap = L.map('issMap').setView([0, 0], 1);
      const attribution =
        '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';

      const tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
      const tiles = L.tileLayer(tileUrl, { attribution });
      tiles.addTo(mymap);

      // Making a marker with a custom icon
      const cyklistLone = L.icon({
        iconUrl: 'cyklist.png',
        iconSize: [50, 32],
        iconAnchor: [25, 16]
      });
      const marker = L.marker([0, 0], { icon: cyklistLone }).addTo(mymap);

[QUOTE]
      const api_url = 'https://api.wheretheiss.at/v1/satellites/25544';

      let firstTime = true;

      async function getISS() {
        const response = await fetch(api_url);
        const data = await response.json();
        const { latitude, longitude } = data;

        marker.setLatLng([latitude, longitude]);
        if (firstTime) {
          mymap.setView([latitude, longitude], 2);
          firstTime = false;
        }
        document.getElementById('lat').textContent = latitude.toFixed(2);
        document.getElementById('lon').textContent = longitude.toFixed(2);
      }
[/QUOTE]

      getISS();

      setInterval(getISS, 1000);
   
    </script>
 
Last edited:

OldMan

King Coder
Here's a start:
Code:
<script>
data = {
    "response": {
        "feedMessageResponse": {
            "count": 3,
            "feed": {
            "id": "xxxxxxx",
            "name": "LH1",
            "description": "LH1",
            "status": "ACTIVE",
            "usage": 0,
            "daysRange": 7,
            "detailedMessageShown": true,
            "type": "SHARED_PAGE"
            },
            "totalCount": 3,
            "activityCount": 0,
            "messages": { 
                "message": [
                    {
                        "@clientUnixTime": "0",
                        "id": 1788105577,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635998,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.8000,
                        "longitude": 12.3000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:53:18+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 35
                    },
                    {
                        "@clientUnixTime": "0",
                        "id": 1788105607,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635698,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.85000,
                        "longitude": 12.45000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:48:18+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 0
                    },
                    {
                        "@clientUnixTime": "0",
                        "id": 1788102790,
                        "messengerId": "0-3036104",
                        "messengerName": "Spot3",
                        "unixTime": 1655635450,
                        "messageType": "UNLIMITED-TRACK",
                        "latitude": 55.9000,
                        "longitude": 12.5000,
                        "modelId": "SPOT3",
                        "showCustomMsg": "Y",
                        "dateTime": "2022-06-19T10:44:10+0000",
                        "batteryState": "GOOD",
                        "hidden": 0,
                        "altitude": 41
                    }
                ]
            }
        }
    }
}
alert(data.response.feedMessageResponse.messages.message[0].latitude);
</script>
 
Top