-
Notifications
You must be signed in to change notification settings - Fork 346
Description
I have some functions that create SVG elements, for example lines, these functions return the last position x, y. When I pass x and y from one function to another it does not update the x and y values, however if I put a console log in between or encapsulate the call within an IIFE this works fine, there is really a problem here
OSX 14.6.1 (23G93)
Chrome version: 127.0.6533.120 (Build oficial) (arm64)
function lineToRight(svg, x, y, size, color) {
let x2 = x + size;
let y2 = y;
pintarLinea(svg, x, y, x2, y2, color);
return [x2, y2];
}
function lineToLeft(svg, x, y, size, color) {
let x2 = x - size;
let y2 = y;
pintarLinea(svg, x, y, x2, y2, color);
return [x2, y2];
}
function lineToUp(svg, x, y, size, color) {
let x2 = x;
let y2 = y - size;
pintarLinea(svg, x, y, x2, y2, color);
return [x2, y2];
}
function lineToDown(svg, x, y, size, color) {
let x2 = x;
let y2 = y + size;
pintarLinea(svg, x, y, x2, y2, color);
return [x2, y2];
}
function drawNutHole(x, y, color) {
const svg = document.getElementById("idSvgElement");
[x, y] = lineToDown(svg, x, y, 2, color);
[x, y] = lineToLeft(svg, x, y, 2, color);
[x, y] = lineToDown(svg, x, y, 3, color);
[x, y] = lineToRight(svg, x, y, 3, color);
[x, y] = lineToUp(svg, x, y, 3, color);
[x, y] = lineToLeft(svg, x, y, 2, color);
[x, y] = lineToUp(svg, x, y, 2, color);
}
drawNutHole(10, 10, 'red')
This doesn't work well, the x and y variables are not updated
function drawNutHole(x, y, color) {
const svg = document.getElementById("idSvgElement");
[x, y] = lineToDown(svg, x, y, 2, color);
console.log(x, y);
[x, y] = lineToLeft(svg, x, y, 2, color);
console.log(x, y);
[x, y] = lineToDown(svg, x, y, 3, color);
console.log(x, y);
[x, y] = lineToRight(svg, x, y, 3, color);
console.log(x, y);
[x, y] = lineToUp(svg, x, y, 3, color);
console.log(x, y);
[x, y] = lineToLeft(svg, x, y, 2, color);
console.log(x, y);
[x, y] = lineToUp(svg, x, y, 2, color);
console.log(x, y);
}
drawNutHole(10, 10, 'red')
Now it works fine, but the code is practically the same, I think there is an evaluation problem.
It also works well if instead of the console.log I do some operation without repercussions, for example:
let _ = x + y
It also works fine if I encapsulate the function calls in IIFE, example:
(() => [x, y] = lineToDown(svg, x, y, 2, color))()
I share the complete script with you
