Отдельное масштабирование x, y с использованием d3.js ⇐ Javascript

[Anonymous]

Я сделал график, используя D3 в JavaScript. Код позволяет пользователю масштабировать оси x и y отдельно, используя жесты зажигания в определенной степени от желаемой оси. Это работает хорошо. Я хотел бы помочь выяснить, как остановить это «разбивающее» поведение домена. Спасибо. Вот код: < /p>

Код: Выделить всё

const staticBaseX = d3.scaleLinear().domain([-10, 10]).range([margin, svgWidth - margin]);
const staticBaseY = d3.scaleLinear().domain([-10, 10]).range([svgHeight - margin, margin]);

let baseX = staticBaseX.copy();
let baseY = staticBaseY.copy();

const ANGLE_TOLERANCE = 10;  // degrees

const zoomBehavior = d3.zoom()
.filter((event) => {
const t = event.type;
return t === 'wheel'
|| t === 'mousedown'
|| t === 'mousemove'
|| t === 'touchstart'
|| t === 'touchmove';
})
.scaleExtent([1e-6, 1e6])
.on('zoom', (event) => {
const t  = event.transform;
const se = event.sourceEvent;

let newX = baseX.domain();
let newY = baseY.domain();

if (se?.touches && se.touches.length === 2) {
// Two-finger pinch gesture — detect angle
const [p1, p2] = se.touches;
const dx = p2.clientX - p1.clientX;
const dy = p2.clientY - p1.clientY;
let angle = Math.abs(Math.atan2(dy, dx)) * 180 / Math.PI;
if (angle > 180) angle -= 180;

const nearH = angle = 180 - ANGLE_TOLERANCE;
const nearV = angle >= 90 - ANGLE_TOLERANCE && angle 

Подробнее здесь: [url]https://stackoverflow.com/questions/79742791/seperate-x-y-scaling-using-d3-js[/url]