路径getLength未定义

Question

我正在尝试制作多个系列d3图表的工具提示。

在mousemove功能上，总长度引起了一些问题，

我的框架是Angular

d3.selectAll(".mouse-per-line").attr("transform", function(
                    d: any,
                    i
                ) {
                    var xDate: any = d3Scale
                    .scaleTime()
                    .range([0, width])
                    .invert(mouse[0]);
                    var bisect = d3Array.bisector(function(d: any) {
                        console.log(d.date, "sdafsdfsdf ");
                        return d.date;
                    }).right;
                    var idx = bisect(d.value, xDate);
                    console.log(bisect)

                    var beginning = 0;
                    var end = lines[i].getTotalLength();
                    // var end = lines[i].getTotalLength();
                    var target = null;

                    var pos;

                    while (true) {
                        target = Math.floor((beginning + end) / 2);
                        pos = lines[i].getPointAtLength(target);
                        if (
                            (target === end || target === beginning) &&
                            pos.x !== mouse[0]
                            ) {
                            break;
                        }
                        if (pos.x > mouse[0]) end = target;
                        else if (pos.x < mouse[0]) beginning = target;
                        else break; //position found
                    }
                    d3.select(this)
                        .select("text")
                        .text(
                            d3Scale
                                .scaleLinear()
                                .range([height, 0])
                                .invert(pos.y)
                                .toFixed(2)
                        );

                    return "translate(" + mouse[0] + "," + pos.y + ")";
                });

长度未定义

var end = lines[i].getTotalLength();

我尽力找到解决方案，但不知道如何克服这个问题。