javascript - 用于 svg 折线 JS 的拆分数组

Question

如何在 JavaScript 中拆分数据数组

{x:30, y:45, x:36, y:49} 

进入表格

[30, 45, 36, 49]

?

我需要这个表格才能将坐标传递给 SVG 折线。我找到了一种方法，Array.prototype.map但我不知道如何使用它。

标签： javascriptarrayssvg

Answer 1

您的对象重复键，这在 javascript 中是不允许的。map 函数用于数组而不是对象。

如果您有一个带有键 x,y,z 的对象，您可以使用将其转换为数组Object.values

const obj = {x:30, y:45, z:36};

//outputs: [30, 45, 36]
console.log(Object.values(obj));

但是，如果您想构造一条折线，您将拥有一个如下所示的数组：

[{x:30, y:45},{x:36, y:49}]

然后你就会有 map 方法。你可以这样做：

const coords = [{x:30, y:45},{x:36, y:49}];

const polyline = coords.map((c)=> c.x + "," + c.y).join(' ');


// outputs: 30,45 36,49
console.log(polyline);