Многострочный график d3, когда график увеличения bru sh перекрывается

Question

Я сталкиваюсь с проблемой при выполнении увеличения sh в многострочном графике. когда масштабирование апплицируется, все графики идут в одной строке. Для одной строки он работает нормально, но для многострочного он не работает

   var brush = d3
      .brush()
      .extent([[0, 0], [this.width, this.height]]) // initialise the brush area: start at 0,0 and finishes at width,height: it means I select the whole graph area
      .on('end', brushended);

  ``` function brushended() {
  const s = d3.event.selection;
  // If no selection, back to initial coordinate. Otherwise, update X axis domain
  if (!s) {
    if (!idleTimeout) return (idleTimeout = setTimeout(idled, 350)); // This allows to wait a little bit
  } else {
    that.xScale.domain([s[0][0] * ratio, s[1][0]].map(that.xScale.invert, that.xScale));
    that.yScale.domain([s[1][1], s[0][1] * ratio].map(that.yScale.invert, that.yScale));
    that.chart.select('.brush').call(brush.move, null); // This remove the grey brush area as soon as the selection has been done
  }
  var t = svg.transition().duration(750);
  that.xAxis
    .transition(t)
    .duration(1000)
    .call(d3.axisBottom(that.xScale));
  that.yAxis
    .transition(t)
    .duration(1000)
    .call(d3.axisLeft(that.yScale));
    that.chart
      .select('.line')
      .transition(t)
      .attr('x', function(d) {
        return that.xScale(d[0]);
      })
      .attr('y', function(d) {
        return that.yScale(d[1]);
      });
    that.chart
      .selectAll('path')
      .transition(t)
      .attr('d', function(d) {
        return line(d);
      });
}```