Highcharts data from a variable is not working but from works fine from an array

Question

I am very new to JavaScript and Highcharts so thank you in advance. I am trying to create a simple chart using Highcharts. When I manuayy create the variable using this array the chart works:

let result = [1084.58,1084.65,1084.64]

However, when when I grab the data from JSON and put that into the variable the chart does not show the data. If I "alert" the variable that is created from the JSON is appears like this:

1084.58,1084.65,1084.64

I am guessing the format of the data from the JSON is not correct. What should I do to correct it?

When I use the manually created variable the chart appears correctly. When I create the variable from the JSON file the chart appears and the X axis has the correct labels but no data in the chart.

I did some testing and found what I think is the issue. The variable that is created from the JSON has quotes around each entry. How can I remove the quotes?

['1084.58', '1084.65', '1084.64']

José Lourenço · Accepted Answer · 2022-03-30 11:14:17Z

1

You'll probably need to convert those values to Number type (using Number() or parseFloat()), you can do something like this:

variable => contains ['1084.58', '1084.65', '1084.64']

variable = variable.map(number => {return Number(number)})

Since you're new to Javascript (Welcome to this language!), I'm gonna explain how it works. "map" is an array method which takes each element of an array and returns an value (simillar to forEach method, but forEach doesn't return anything). So when using map to return each element of an array like this you're pushing the new element to the new array, it will be something like

variable.map(number => {return Number(number)})

On the 1st element: It returns Number('1084.58'), then it returns 1084.58 (number type)

On the 2nd element: It returns Number('1084.65'), then it returns 1084.65 (number type)

On the 3rd element: It returns Number('1084.64'), then it returns 1084.64 (number type)

Each return into this new variable is like an array.push(element)

Hope you got the idea

answered Mar 30, 2022 at 11:14

José Lourenço

1193 silver badges4 bronze badges

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

3 Comments

Amateur Over a year ago

Thank you Jose Lourenco! Perfect explanation, thank you for taking the time. I really do appreciate it.

Amateur Over a year ago

Jose Lourenco, how can I use the same 'map' idea to remove single quotes from a date or a string? I have a string of data in an array like this '5/27/2021 12:00:00 AM' with single quotes around the date and I would like to remove the single quotes. Thank you!

José Lourenço Over a year ago

Hi! For this you'll convert your string data in date type, you can actually use something like: variableData = '5/27/2021 12:00:00 AM' , and then dateTypeVariableData = new Date('5/27/2021 12:00:00 AM') or dateTypeVariableData = new Date(variableData)

Collectives™ on Stack Overflow

Highcharts data from a variable is not working but from works fine from an array

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related