Unwanted bracket keeps returning from my function (JavaScript/html)

Question

"Write a function named "plotLine" that takes an array of points where each element is an array in the format [x, y] and both x and y are floating points Numbers. The function will create a line chart in a div with id of "plot" using the Plotly library. You may assume that your code runs on a page where Plotly is downloaded"

Here is the code I have for this:

function plotLine(array){
  var object1 =
  {
    "data":
    [{
        "x": array.map(i => i[0]),
        "y": array.map(i => i[1])
    }]
  };
  Plotly.newPlot('plot', object1)
}

However, I am getting an unwanted curly bracket around "data" in the return value, see below:

html:

{'divId': 'plot', 'data': {'data': [{'y': [19.44, -5.17, -8.45, 19.14, 5.61], 'x': [8.94, -5.57, 4.45, -1.24, 0.87]}]}}

expected:

{'divId': 'plot', 'data': [{'y': [19.44, -5.17, -8.45, 19.14, 5.61], 'x': [8.94, -5.57, 4.45, -1.24, 0.87]}]}

as you can see, my html code is returning an undesired curly bracket. I am wondering how to remove this so that the output from the plotLine() function will match the expected output? Thank you in advance for your help!

Answer 1

I think that API is adding the attribute data natively.

Plotly.newPlot('plot', [{
  "x": array.map(i => i[0]),
  "y": array.map(i => i[1])
}]);