根据具有变换属性的另一个路径协调插入 svg 路径

Question

我想在我已经应用了属性的另一条路径（带有进度参数）上插入一条路径transform。问题是，当我从 和 params 获取点位置时，getPointAtLength(//h2 path//)与h2 的位置不同x。y所以他们的定位是开箱即用的。let paths = d3.select('svg').select("#h2").selectAll('path.train').data([1,2]);let branch=d3.select('svg').select("#h2").select('path')paths.enter().append('path')          .attr('d', d3.symbol().type(d3.symbolTriangle))          .attr('class', 'train')          .attr('fill','black')          .attr('transform',(d,i)=>  {          let point = branch.node()              .getPointAtLength(30)           return `translate(${point.x},${point.y}`          })<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.9.0/d3.min.js"></script><svg viewBox="0 0 388.71 412.14">    <g data-id="branch" id="h2" transform="translate(-885 -562) ">        <g class="branch-label" id="h2select" transform="translate(-240 -340)"></g>        <rect fill="rgba(255,255,255,1)" height="11" id="h2" width="12"></rect>        <path d="M1093.763,1595.658 v -82.417 c 0,0 5,-14.987 -18.452,-16.644 -23.452,-1.657 -40.9,2.386 -54.093,-11.537 -13.193,-13.923 -132.873,-159.193 -132.873,-159.193 0,0 -6.456,-10.249 -24.986,-14.661 -18.53,-4.412 -11.029,-16.736 -2.10392,-28.6309 2.68431,-3.5775 12.32475,-15.4715 21.44325,-26.363" data-name="h2" fill="none" id="h2-3" stroke="#efcf2f" stroke-linecap="round" stroke-width="2" transform="translate(208.67 -656.38)" style="opacity: 1;"></path>    </g></svg>我想要的是如何将三角形定位在路径的 30% 处而不删除 svg 上的“变换属性”？