Javascript add integers to mixed array

Question

I'm trying to create some synthetic data which needs to be represented in this kind of structure (an array of arrays):

dataset = [
  ['Period', 'c1', 'c2', 'c3'],
  ['2018-01', 2000, 2002, 2004],
  ['2018-08', 3000, 3003, 3006],
  ['2019-01', 4000, 4002, 4008]
]

I've made a function to help:

function get_datapoints() {
    dates = ['2018-01', '2018-08', '2019-01']

    data = [];
    data.push(['Period', 'c1', 'c2', 'c3'])

    for (i in dates) {
        sequence = []
        for (val = 1; val < 4; val++) {
            sequence.push(get_randomval())
        }
        data.push([dates[i], sequence.join()])
        console.log(data)
    }
    return data

function get_randomval(min = 2000, max = 5000) {
    let difference = max - min;
    let rand = Math.random();
    rand = Math.floor(rand * difference);
    rand = rand + min;
    return parseInt(rand);
}

This is generating data which looks like this:

[
  ['Period', 'c1', 'c2', 'c3']
  ['2018-01', '59797,47895,63209']
  ['2018-08', '28342,38450,70694']
  ['2019-01', '32348,44872,92501']
]

This understandably gives the error: Error: Row 1 has 2 columns, but must have 4

Clearly there are two 'fields' in each data array, each enclosed in a single quote pair. I'm pulling my hair out trying to figure out how to get those integers into the array without the single quotes. This data is actually to be used as part of a google.visualization.arrayToDataTable needed by Google Charts.

https://developers.google.com/chart/interactive/docs/gallery/linechart shows an example of this kind of structure (an array with both strings and ints).

How can I get those values into their arrays without the single quotes? Thanks!

Use data.push([dates[i], ...sequence]) instead of data.push([dates[i], sequence.join()]) — adiga
– adiga, Commented Apr 18, 2022 at 13:57
Fantastic! All working now! Spread operator huh? Thats a new one to me. — Indrid
– Indrid, Commented Apr 18, 2022 at 14:04
You definitely should be declaring your variables with let or const, as appropriate. — Pointy
– Pointy, Commented Apr 18, 2022 at 14:13
Thanks @Pointy, yes, I'm slowly getting back up to speed with Js now and appreciate the observation and suggestion. — Indrid
– Indrid, Commented Apr 19, 2022 at 17:41

Casper Kuethe · Accepted Answer · 2022-04-18 14:00:46Z

1

The problem is sequence.join() This method is used for strings and when no arguments are provided it converts the elements in the array to a string with a , as delimiter. That's why you get the string.

You could use the spread operator instead, this will behave as you inteded to.

data.push([dates[i], ...sequence])

answered Apr 18, 2022 at 14:00

Casper Kuethe

1,1818 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sachin · Accepted Answer · 2022-04-18 14:00:16Z

1

instead of using join here data.push([dates[i], sequence.join()]) (which converts it to a string) use the spread operator like this data.push([dates[i], ...sequence]).

Ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join

answered Apr 18, 2022 at 14:00

Sachin

9862 gold badges10 silver badges25 bronze badges

Comments

kabanus · Accepted Answer · 2022-04-18 14:05:23Z

1

You are explicitly converting to a string using sequence.join. You should instead pass each sequence item as a separate argument. I see answers suggesting the nifty unpacking operator:

[dates[i], ...sequence]

but there are older solutions which may be more readable such as

data.push([dates[i]].concat(sequence))

or using unshift to prepend dates[i] (costs an extra line), or my favorite, just initialize the sequence like you want it:

sequence = [dates[i]]

leave the code as is, and then just

data.push(sequence)

answered Apr 18, 2022 at 14:05

kabanus

26.3k7 gold badges48 silver badges79 bronze badges

1 Comment

Indrid Over a year ago

Thanks you @kabanus this makes a lot of sense. I like simple!

Collectives™ on Stack Overflow

Javascript add integers to mixed array

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related