How to loop though Alpha Vantage timestamps

Question

I am trying to loop through the JSON from my API call and plot each high trade price in my react app (the end goal will be to create a chart). The issue is, I would need to know the exact timestamp string beforehand, because the API isn't structured numerically. Here is my code (see the console log). I am currently testing the proper endpoint BEFORE creating a loop, which is why you don't see one.

If you are curious, the this.state.stock is AMD, which I am using to test it. Eventually it will be the user input. How am I supposed to loop through?

componentDidMount() {
  axios
  .get(`https://www.alphavantage.co/query?function=TIME_SERIES_INTRADAY&symbol=${this.state.stock}&interval=5min&apikey=J6ED0QFWG3T1KLTD`)
  .then((response) => {
    this.setState({
      dailyQuote: response.data

    })
    console.log("daily quote",this.state.dailyQuote['Time Series (5min)']['2019-06-27 14:15:00']['2. high'])

  })
}

Here is a sample of the API call data

{
  "Meta Data": {
    "1. Information": "Intraday (5min) open, high, low, close prices and volume",
    "2. Symbol": "amd",
    "3. Last Refreshed": "2019-06-28 16:00:00",
    "4. Interval": "5min",
    "5. Output Size": "Compact",
    "6. Time Zone": "US/Eastern"
  },
  "Time Series (5min)": {
    "2019-06-28 16:00:00": {
      "1. open": "30.3900",
      "2. high": "30.4000",
      "3. low": "30.3300",
      "4. close": "30.3700",
      "5. volume": "2242133"
    },
    "2019-06-28 15:55:00": {
      "1. open": "30.3700",
      "2. high": "30.4400",
      "3. low": "30.3601",
      "4. close": "30.3900",
      "5. volume": "1294256"
    },
    "2019-06-28 15:50:00": {
      "1. open": "30.4350",
      "2. high": "30.4500",
      "3. low": "30.3500",
      "4. close": "30.3700",
      "5. volume": "1265203"
    },
    "2019-06-28 15:45:00": {
      "1. open": "30.4750",
      "2. high": "30.4750",
      "3. low": "30.4300",
      "4. close": "30.4350",
      "5. volume": "664693"
    },
    "2019-06-28 15:40:00": {
      "1. open": "30.4850",
      "2. high": "30.4900",
      "3. low": "30.4550",
      "4. close": "30.4700",
      "5. volume": "539474"
    },
    "2019-06-28 15:35:00": {
      "1. open": "30.4750",
      "2. high": "30.5050",
      "3. low": "30.4500",
      "4. close": "30.4900",
      "5. volume": "685410"
    },
    "2019-06-28 15:30:00": {
      "1. open": "30.5100",
      "2. high": "30.5200",
      "3. low": "30.4600",
      "4. close": "30.4800",
      "5. volume": "376771"
    },
    "2019-06-28 15:25:00": {
      "1. open": "30.5400",
      "2. high": "30.5600",
      "3. low": "30.5000",
      "4. close": "30.5101",
      "5. volume": "288554"
    },
    "2019-06-28 15:20:00": {
      "1. open": "30.5600",
      "2. high": "30.5600",
      "3. low": "30.5200",
      "4. close": "30.5350",
      "5. volume": "218143"
    },
    "2019-06-28 15:15:00": {
      "1. open": "30.5703",
      "2. high": "30.5800",
      "3. low": "30.5400",
      "4. close": "30.5557",
      "5. volume": "281558"
    },
    "2019-06-28 15:10:00": {
      "1. open": "30.5700",
      "2. high": "30.5850",
      "3. low": "30.5500",
      "4. close": "30.5750",
      "5. volume": "290714"
    },
    "2019-06-28 15:05:00": {
      "1. open": "30.5803",
      "2. high": "30.6100",
      "3. low": "30.5750",
      "4. close": "30.5750",
      "5. volume": "169868"
    },
    "2019-06-28 15:00:00": {
      "1. open": "30.6050",
      "2. high": "30.6100",
      "3. low": "30.5800",
      "4. close": "30.5850",
      "5. volume": "186744"
    },
    "2019-06-28 14:55:00": {
      "1. open": "30.5650",
      "2. high": "30.6100",
      "3. low": "30.5500",
      "4. close": "30.6050",
      "5. volume": "378489"
    },
    "2019-06-28 14:50:00": {
      "1. open": "30.5700",
      "2. high": "30.5800",
      "3. low": "30.5500",
      "4. close": "30.5650",
      "5. volume": "247525"
    },
  }

Yea.. Alpha Vantage really F* the time series data, don't they know how to use array at Alpha Vantage? It's not your fault Cevee.. — Melroy van den Berg, Apr 11 '20 at 22:10

score 2 · Answer 1 · answered Sep 27 '19 at 21:57

If you are just looking to loop through the data, use something like this:

var strProp, strValue;
for (strProp in someArray) {
    console.log(`Name: ${strProp}; Value: ${someArray[strProp}\n`;
}

That will show you the names. You can also do something like this to actually use them in code because of index signatures:

var data = { "meta" : "", "series" : ""};
for (var strProp in apiResults) {
    if (strProp == "Meta Data") {
        data["meta"] = apiResults[strProp];
    } else if (strProp == "Time Series (5min)") {
        data["series"] = apiResults[strProp];
    } else {
        console.error(`Cannot read data from API call! Returns: ${apiResults}`);
    }

You can then read from data["series"] in the same way.

Mikkel · Answer 2 · 2020-04-12T12:21:04.603

Welcome to Stack Overflow.

The JSON data format isn't in the best format for easy charting, you may want to convert it to a more suitable format first by iterating over the date/time keys of the object. They are in descending order, so you will also need to reverse the entries.

Here is some sample code:

const rawSeries = response.data['Time Series (5min)']
const series = Object.keys(rawSeries).reverse().map(timestamp => {
  return {timestamp, value: rawSeries[timstamp]['2. high']}
})
// series will now contain an array of objects like this:
// [
// {timestamp: "2019-06-28 14:50:00", value: "30.5000"},
// {timestamp: "2019-06-28 14:55:00", value: "30.6100"},
// ...
//]

If you just want an array of data points without labels, you can do this:

const rawSeries = response.data['Time Series (5min)']
const series = Object.keys(rawSeries).reverse().map(timestamp => {
  return rawSeries[timestamp]['2. high']
})
// series will now contain an array of values like this:
// ["30.5000","30.6100", ... ]

Yea.. Alpha Vantage really F* the time series data, don't they know how to use array at Alpha Vantage? — Melroy van den Berg, Apr 11 '20 at 22:10
There is a typo, should be: `timestamp` instead of `timstamp` — Melroy van den Berg, Apr 11 '20 at 23:03

score 0 · Answer 3 · answered Sep 05 '20 at 06:56

Please install the npm package of Alpha vantage Wrapper

npm install --save alpha_vantage_api_wrapper for NPM

var Alpha = require('alpha_vantage_api_wrapper').Alpha; //Alpha Wrapper
var alpha = new Alpha('demo');  
var stock_Dates = [];    //Array Of Data      
var stock_opens = [];
var stock_highs = [];
var stock_lows = [];
var stock_closes = [];
var stock_volumes = [];

    const intraDay = (data['Time Series (5min)']);             //Time Series Data 
    // var intraDay_date = { intraday: stock_Dates };
    for(var update in intraDay){
        var stock_Date = update;
        var stock_open = intraDay[update]['1. open'];//Narrowing the endpoints for accessing the req Data
        var stock_high = intraDay[update]['2. high'];
        var stock_low = intraDay[update]['3. low'];
        var stock_close = intraDay[update]['4. close'];
        var stock_volume = intraDay[update]['5. volume'];
        stock_Dates.push(stock_Date);   //Pushing the Data into the Array of Data
        stock_opens.push(stock_open);       
        stock_highs.push(stock_high);
        stock_lows.push(stock_low);
        stock_closes.push(stock_close);
        stock_volumes.push(stock_volume);
    }

How to loop though Alpha Vantage timestamps

3 Answers3