CODEWITHSUNDEEP
javascript
user4310768
user4310768

Reputation:

Defining value that doesnt change

I realise the title might be misleading, but did not know how to phrase it any other way.

The problem im facing is that I draw up a SVG panel from a JSON object, and in that object there is moving parts that is being controlled by a server that is sending values to us. I get the moving part to be in the right position, but after awhile it keeps adding X position to itself so much that it goes out of the border, which its not meant to do. Basically what it does is add X+X+X repeatedly from the initialposition, but I want it to consider the initialposition first when calculating a new position to be at.

Here is the function behind that, I tried having an if statement that checked for a variable standardX and standardY, while they were set as undefined it would set obj.transform.baseVal.getItem(length).matrix.e as the value to it, but that did not work.

Any tips on any workaround? Thanks in advance.

var moveX = function(elem, i) {
return function () {
    var stepvalue = 6.25;
    var step = "0";
    var x1 = "0";
    var y1 = "0";
    var obj = elem.dyn[i].obj;
    var standardX = obj.transform.baseVal.getItem(length).matrix.e;
    var standardY = obj.transform.baseVal.getItem(length).matrix.f;
    console.log(elem.value);

    if (elem.value <= elem.dyn[i].rlow) {
        step = 0;
        x1 = standardY;
        y1 = standardX;
        obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


    } else if (elem.value > elem.dyn[i].rlow && elem.value <= elem.dyn[i].rhigh) {
        step = stepvalue * elem.value;
        x1 = step -25;
        y1 = standardY;
        x1 += standardX;
        obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


    } else {
        step = stepvalue * elem.dyn[i].rhigh;
        x1 = step -25;
        y1 = standardY;
        x1 += standardX;
        obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");

    }

}};

Upvotes: 1

Views: 51

Answers (1)

hazerd
hazerd

Reputation: 592

Not really sure as we don't have access to the whole code.
From what I gather the problem you're having is that you are initializing standardX and standardY at every call of the function.

You might want to initialize them when you declare the function, like so :

var moveX = function(elem, i) {
    return function () {
        var stepvalue = 6.25;
        var step = "0";
        var x1 = "0";
        var y1 = "0";
        var obj = elem.dyn[i].obj;

        console.log(elem.value);

        if (elem.value <= elem.dyn[i].rlow) {
            step = 0;
            x1 = moveX.standardY;
            y1 = moveX.standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


        } else if (elem.value > elem.dyn[i].rlow && elem.value <= elem.dyn[i].rhigh) {
            step = stepvalue * elem.value;
            x1 = step -25;
            y1 = moveX.standardY;
            x1 += moveX.standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


        } else {
            step = stepvalue * elem.dyn[i].rhigh;
            x1 = step -25;
            y1 = moveX.standardY;
            x1 += moveX.standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");

        }

    };
};
moveX.standardX = obj.transform.baseVal.getItem(length).matrix.e;
moveX.standardY = obj.transform.baseVal.getItem(length).matrix.f;

Another option might be the following, if it needs some kind of dynamic initialization.

var moveX = function(elem, i) {
    var standardX = obj.transform.baseVal.getItem(length).matrix.e;
    var standardY = obj.transform.baseVal.getItem(length).matrix.f;

    return function () {
        var stepvalue = 6.25;
        var step = "0";
        var x1 = "0";
        var y1 = "0";
        var obj = elem.dyn[i].obj;

        console.log(elem.value);

        if (elem.value <= elem.dyn[i].rlow) {
            step = 0;
            x1 = standardY;
            y1 = standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


        } else if (elem.value > elem.dyn[i].rlow && elem.value <= elem.dyn[i].rhigh) {
            step = stepvalue * elem.value;
            x1 = step -25;
            y1 = standardY;
            x1 += standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");


        } else {
            step = stepvalue * elem.dyn[i].rhigh;
            x1 = step -25;
            y1 = standardY;
            x1 += standardX;
            obj.setAttribute("transform", "translate("+ x1 + "," + y1 +")");

        }

    };
};

To be noted that all of this is possible because you can access variables declared outside the current function.
You can find more on function scope and context switch in this article.

Upvotes: 1

Related Questions