Untitled

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <style>
      svg{background:grey;width:400px;height:400px}
    </style>
  </head>
  <body>
    <svg viewBox="0 0 100 100">
      <path id="lamelle" d="M6,0 a6 6 0 0 0 -6 6h7a1.5 1.5 0 0 1 0 3h-7a6 6 0 0 0 6 6h10c5 0 5 -5 10 -5h20a 5 5 0 0 0 0 -10z" stroke="red"/>
    </svg>
    <svg viewBox="0 0 100 100">
      <path id="lamelle2" d="M0,0" stroke="red"/>
    </svg>
    <textarea id="ta">

    </textarea>
    <script>
    function flatten(src,dest,num){
      var l = src.getTotalLength()
      var p = src.getPointAtLength(0)
      var d = `M${p.x} ${p.y}`
      var pl=`polygon([[${p.x},${p.y}]`
      var ia=[0]
      n=0
      for(var i = (l/num);i<=l;i+=(l/num)){
        n++
        ia.push(n)
        p = src.getPointAtLength(i)
        d+=`L${p.x} ${p.y}`
        pl+=`,[${p.x},${p.y}]`
      }
      pl+=`],[[${ia.join(",")}]])`
      ta.value=pl
      dest.setAttribute("d",d+"z")
    }
    flatten(lamelle,lamelle2,200)
    </script>
  </body>
</html>