REST API Query formatting for a simple line chart

Queries and Resources
1

Hello everyone. I will apologize ahead of time for my extreme noobness but I am trying to figure out how to make simple temperate line graph based on a REST api query. The query I have setup is returning a dataset that looks like the following below. How can graph only the returned values "t" and "v" from the the query.data.data below and get this to graph?

This is the query:

https://api.tidesandcurrents.noaa.gov/api/prod/datagetter?date=today&station=9410230&product=water_temperature&units=english&time_zone=gmt&application=ports_screen&format=json

And the returned data:

 {
      "metadata": {
    "id": "9410230",
    "name": "La Jolla",
    "lat": "32.8669",
    "lon": "-117.2571"
      },
      "data": [
    {
      "t": "2020-09-24 17:00",
      "v": "69.4",
      "f": "0,0,0"
    },
    {
      "t": "2020-09-24 17:06",
      "v": "69.4",
      "f": "0,0,0"
    },
    {
      "t": "2020-09-24 17:12",
      "v": "69.3",
      "f": "0,0,0"
    },
    {
      "t": "2020-09-24 17:18",
      "v": "69.3",
      "f": "0,0,0"
    },
    {
      "t": "2020-09-24 17:24",
      "v": "69.3",
      "f": "0,0,0"
    }
    }
      ]
     }
2

Hello!

This is a great use case for the Plotly chart component. I've included a demo screenshot but the gist is you'll want to set {{QUERY_NAME.data.data}} as your datasource. The component pre-populates the rest of the fields with our best guess at x and y values. You can then edit the chart type, values, layout, etc.

image
image1910×1018 80.9 KB

Hope this helps!

3

That works great. Thanks!