将数组中的对象连接到SVG路径

Question

我想动态设置svg路径的分段。我将这些段作为对象存储在数组中。但是我在将它们连接到以空格作为分隔符的有效路径时遇到问题。我尝试了join（），但不确定如何正确访问数组中的对象。实现此目标的最佳方法是什么？

d="M 10 20 L 10 0 L 30 50 z"

let segments = [
       {
           "type": "M",
           "values": [ 10, 20 ]
       },
       {
            "type": "L",
            "values": [ 10, 0 ]
       },
       {
             "type": "L",
             "values": [ 30, 5 ]
       }
]

Answer 1

地图+联接在这里应该可以做得很好：

> segments.map(seg => `${seg.type} ${seg.values.join(' ')}`).join(' ') + " z";
  "M 10 20 L 10 0 L 30 5 z"

Answer 2

您可以像这样使用DISTINCT：

DISTINCT