We Keep Coding

JavaScript how to transform String into a function

I am doing a calculator for definite integrals, where I can add the function to integrate by using this interface.Calculator interface
The point is that once I call the function to integrate it recognizes it as a String and i cannot calculate over it. But if I add the function hardcoding it, it works perfectly fine.
prueba() {
//**** this.cadena is the function I add by using the interface
var sal = this.cadena;
console.log(sal);
var f = function (x) {
//**** The comented return works perfecly fine
//return 1/x;
return parseFloat(sal);
};
var integrada = this.integ(sal, 1, 2);
this.cadena = integrada;
this.imprime();
}
integ(f, a, b) {
var area = 0;
var dx = 0.001;
for (let x = a; x < b; x += dx) {
area += dx * f(x);
}
return area;
}

Can you try below line
var integrada = this.integ(parseFloat(sal), 1, 2);

Javascript: Calculate angle of rectangle with 4 corner points

I have an matrix like this:
var matrix = [
"00000000000000000000000",
"00000000001100000000000",
"00000000111110000000000",
"00000001111111000000000",
"00000111111111100000000",
"00000111111111000000000",
"00000011111100000000000",
"00000001110000000000000",
"00000000100000000000000",
"00000000000000000000000"
]
...and I know the 4 corner points (x/y-coordinates) of the figure (rectangle of '1'-characters) like..
[11,1]
[5,4]
[14,4]
[8,8]
Is there an easy way to calculate the rotation angle of the rectangle like I've symbolized in this image?
Because I have no clue how to continue I can not provide you more code than this:
Edit: The function above gets the minY and the maxX value from the 4 points. Afterwards the function is calculating the distance between the two points. But now how to calculate the angle?
function calculate_angle(corner_object) {
Array.prototype.calculate_distance = function() {
var x1=this[0],y1=this[1],x2=this[2],y2=this[3]
return Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1)).toFixed(2);
}
var list = [my_object.corner1,my_object.corner2,my_object.corner3,my_object.corner4]
var extreme_result = {
'xMax': list.filter(e => e[0] === Math.max(...list.map(e => e[0]))),
'yMin': list.filter(e => e[1] === Math.min(...list.map(e => e[1])))
}
var distance = [extreme_result.xMax[0][0],extreme_result.xMax[0][1],extreme_result.yMin[0][0],extreme_result.yMin[0][1]].calculate_distance()
// distance between two points is "distance"
console.log(distance)
}
var my_object = {
"corner1":[5,4],
"corner2":[11,1],
"corner3":[14,4],
"corner4":[8,8]
}
calculate_angle(my_object)
I hope somebody can help me with my code... Thanks a lot in advance, jonas

UPDATED
I think you can follow this script:
https://codepen.io/pablodarde/pen/aVEmGO
Get the position of the highest rectangle base vertex;
Get the position of the lower rectangle base vertex;
Calc the rectangle opposite Leg: (H) with the above information;
Calc the rectangle adjacent leg: (W) with the above information;
Calc the hypotenuse (I): const I = Math.sqrt(Math.pow(H, 2) + Math.pow(W, 2));
Then, you have the angle cosine. const cosAngle = Math.cos(W/I);
Get the angle value by doing: const angle = Math.acos(cosAngle);
//https://stackoverflow.com/questions/47365879/javascript-calculate-angle-of-rectangle-with-4-corner-points/47366425#47366425
const matrix = [
"00000000000000000000000",
"00000000001100000000000",
"00000000111110000000000",
"00000001111111000000000",
"00000111111111100000000",
"00000111111111000000000",
"00000011111100000000000",
"00000001110000000000000",
"00000000100000000000000",
"00000000000000000000000"
];
function getRectangleLowerBaseVertice(arr) {
for (let i = arr.length -1; i > 0; i--) {
if (arr[i].indexOf('1') !== -1) {
return {line: i, column: arr[i].indexOf('1')};
}
}
}
function getRectangleHigherBaseVertice(arr) {
let col = 0;
let previous = 0;
let line = 0;
for (let i = 0; i < arr.length; i++) {
if (arr[i].lastIndexOf('1') !== -1) {
if (arr[i].lastIndexOf('1') > previous) {
col = arr[i].lastIndexOf('1');
previous = col;
line = i;
}
}
}
return {line: line, column: col};
}
const higherBaseVertex = [
Number(getRectangleHigherBaseVertice(matrix).line),
Number(getRectangleHigherBaseVertice(matrix).column),
];
const lowerBaseVertex = [
Number(getRectangleLowerBaseVertice(matrix).line),
Number(getRectangleLowerBaseVertice(matrix).column),
];
function toDegrees (angle) {
return angle * (180 / Math.PI);
}
const oppositeLeg = lowerBaseVertex[0] - higherBaseVertex[0];
const adjacentLeg = Math.abs(lowerBaseVertex[1] - higherBaseVertex[1]);
const hypotenuse = Math.sqrt(Math.pow(oppositeLeg, 2) + Math.pow(adjacentLeg, 2));
const cosAngle = Math.cos(adjacentLeg / hypotenuse);
const angle = toDegrees(Math.acos(cosAngle));
document.getElementById('lower-base-vertex').innerHTML = `lower base vertex, line: ${getRectangleLowerBaseVertice(matrix).line}, column: ${getRectangleLowerBaseVertice(matrix).column}`;
document.getElementById('higher-base-vertex').innerHTML = `higher base vertex, line: ${getRectangleHigherBaseVertice(matrix).line}, column: ${getRectangleHigherBaseVertice(matrix).column}`;
document.getElementById('opposite-leg').innerHTML = `Opposite leg: ${oppositeLeg}`;
document.getElementById('adjacent-leg').innerHTML = `Adjacent leg: ${adjacentLeg}`;
document.getElementById('hypotenuse').innerHTML = `hypotenuse: ${hypotenuse}`;
document.getElementById('cos-angle').innerHTML = `angle cosine: ${cosAngle}`;
document.getElementById('angle').innerHTML = `angle: ${angle}`;
<div id="lower-base-vertex"></div>
<div id="higher-base-vertex"></div>
<div id="rectangle-height"></div>
<div id="opposite-leg"></div>
<div id="adjacent-leg"></div>
<div id="hypotenuse"></div>
<div id="cos-angle"></div>
<div id="angle"></div>

QuadEdge dual edge coordinate's always the origin

I am trying to implement, in Javascript, a divide and conquer algorithm to calculate a Delanay triangulation, in order to obtain a Voronoi diagram. The coded is based on the C++ implementation described in Graphic Gems IV which, in turn, is based on the famous Guibas and Stolfi paper from 1985. It uses a Quad-Edge data structure.
The algorithm divides the set of points in half; then, it triangulates those parts separately; lastly it proceeds to "marry" the two halves.
The problem is that, well, it does not work. It gets stuck in a infinite recursion when "marrying" the two halves. I think the problem might be in the Quad-Edge structure itself, because the first edge's and its destination edge have the same coordinates and its dual and inverted rotation edge point to (0, 0).
Here is the code (the translation from C++ is not 100 %, I asked for help since I am still a JS noob):
//The data structure starts here.
var Edge = function (num, qe) {
var _this = this;
this.num = num;
this.qe = qe;
this.coord = new paper.Point();
this.sym = function () {
return (_this.num < 2) ? _this.qe[_this.num + 2] : this.qe[_this.num - 2];
};
this.oNext = function () {
return this.next;
};
this.setNext = function (next) {
this.next = next
};
this.rot = function () {
return (this.num < 3) ? _this.qe[_this.num + 1] : _this.qe[_this.num - 3];
};
this.invRot = function () {
return (_this.num > 0) ? _this.qe[_this.num - 1] : _this.qe[_this.num + 3];
};
this.oPrev = function () {
return _this.rot().oNext().rot();
};
this.dNext = function () {
return _this.sym().next.sym();
};
this.dPrev = function () {
return _this.invRot().oNext().invRot();
};
this.lNext = function () {
return _this.invRot().oNext().rot();
};
this.lPrev = function () {
return _this.oNext().sym();
};
this.rNext = function () {
return _this.rot().oNext().invRot();
};
this.rPrev = function () {
return _this.sym().oNext();
};
this.dest = function () {
return _this.sym().coord;
};
this.endPoints = function (or, de) {
this.coord = or;
this.sym().coord = de;
};
};
//The first edge always points to itself
//as in edge.oNext().coord === edge.coord
var QuadEdge = function () {
this.edges = new Array(4);
for (var i = 0; i < 4; i++) {
this.edges[i] = new Edge(i, this.edges);
}
this.edges[0].setNext(this.edges[0]);
this.edges[1].setNext(this.edges[3]);
this.edges[2].setNext(this.edges[2]);
this.edges[3].setNext(this.edges[1]);
};
//Constructs and returns a new QuadEdge.
function makeEdge() {
var qe = new QuadEdge();
return qe.edges[0];
}
//Helper function, returns twice of the area of the triangle formed
//by a, b and c. Negative if the triangle is clockwise.
function triArea(a, b, c) {
return (b.x - a.x) * (c.y - a.y) - (c.x - a.x) * (b.y - a.y);
}
//Tests if the point d is inside the circumcircle of the triangle formed by
//a, b, and c. As described by Guibas and Stolfi in their paper.
function inCircle(a, b, c, d) {
return (Math.pow(a.x, 2) + Math.pow(a.y, 2)) * triArea(b, c, d) -
(Math.pow(b.x, 2) + Math.pow(b.y, 2)) * triArea(a, c, d) +
(Math.pow(c.x, 2) + Math.pow(c.y, 2)) * triArea(a, b, d) -
(Math.pow(d.x, 2) + Math.pow(d.y, 2)) * triArea(a, b, d) > 0;
}
//Tests if triangle is in counterclockwise order.
function cClockwise(a, b, c) {
return triArea(a, b, c) > 0;
}
//Tests if point is left of the provided edge.
function leftOf(point, edge) {
return cClockwise(point, edge.coord, edge.dest());
}
//Tests if point is right of the provided edge.
function rightOf(point, edge) {
return cClockwise(point, edge.dest(), edge.coord);
}
//If a and b are distinct, splice will combine them; if not, it will
//separate them in two.
function splice(a, b) {
var alpha = a.oNext().rot();
var beta = b.oNext().rot();
var t1 = b.oNext();
var t2 = a.oNext();
var t3 = beta.oNext();
var t4 = alpha.oNext();
a.setNext(t1);
b.setNext(t2);
alpha.setNext(t3);
beta.setNext(t4);
}
function deleteEdge(e) {
splice(e, e.oPrev());
splice(e.sym(), e.sym().oPrev());
}
function connect(e1, e2) {
var e = makeEdge();
e.endPoints(e1.dest(), e2.coord);
splice(e, e1.lNext());
splice(e.sym(), e2);
return e;
}
//Fixed thanks to: http://www.rpenalva.com/blog/?p=74
function valid(e, basel) {
return rightOf(e.dest(), basel);
}
//This is the actual algorithm.
function divideAndConquer(vertices) {
if (vertices.length === 2) {
var a = makeEdge();
a.coord = vertices[0];
a.sym().coord = vertices[1];
return {right: a, left: a.sym()};
}
else if (vertices.length === 3) {
var a = makeEdge(), b = makeEdge();
splice(a.sym(), b);
a.coord = vertices[0];
b.coord = vertices[1];
a.sym().coord = b.coord;
b.sym().coord = vertices[2];
if (cClockwise(vertices[0], vertices[1], vertices[2])) {
connect(b, a);
return {right: a, left: b.sym()};
}
else if (cClockwise(vertices[0], vertices[2], vertices[1])) {
var c = connect(b, a);
return {right: c.sym(), left: c};
}
else
return {right: a, left: b.sym()};
}
else if (vertices.length >= 4) {
var half = Math.floor(vertices.length / 2);
var lObjects = divideAndConquer(vertices.slice(0, half));
var rObjects = divideAndConquer(vertices.slice(half, vertices.length));
var ldo = lObjects.right, ldi = lObjects.left;
var rdi = rObjects.right, rdo = rObjects.left;
while (true) {
if (leftOf(rdi.coord, ldi))
ldi = ldi.lNext();
else if (rightOf(ldi.coord, rdi))
rdi = rdi.rPrev();
else
break;
}
var basel = connect(rdi.sym(), ldi);
if (ldi.coord === ldo.coord)
ldo = basel.sym();
if (rdi.coord === rdo.coord)
rdo = basel;
while (true) {
var lcand = basel.sym().oNext();
if (valid(lcand, basel)) {
while (inCircle(basel.dest(), basel.coord, lcand.dest(), lcand.oPrev().dest())) {
var t = lcand.oNext();
deleteEdge(lcand);
lcand = t;
}
}
var rcand = basel.oPrev();
if (valid(rcand, basel)) {
while (inCircle(basel.dest(), basel.coord, rcand.dest(), rcand.oPrev().dest())) {
var t = rcand.oPrev();
deleteEdge(rcand);
rcand = t;
}
}
//This is the part where it gets stuck,
//it never reaches this condition.
if (!valid(lcand, basel) && !valid(rcand, basel)) {
break;
}
if (!valid(lcand, basel) || (valid(rcand, basel) && inCircle(lcand.dest(), lcand.coord, rcand.coord, rcand.dest()))) {
basel = connect(rcand, basel.sym());
}
else {
basel = connect(basel.sym(), lcand.sym());
}
}
return {right: ldo, left: rdo};
}
}
The point class is from PaperJS.
EDIT: set up a Codepen illustrating the problem; click in the output window to add the points. The recursions happens when the fourth point is added.
EDIT 2: fixed the infinite recursion, caused by the valid function, thanks to code found on Ruben Penalva's blog. But, the problem of the dual edge pointing to the origin still persists. That is:
edge.rot().coord === (0, 0)
That makes me think even more that the problem is with the QuadEdge structure itself.
EDIT 3: reading the code carefully for the nth time, I realized that the coordinates for the rotation and inversed rotation edge are never set. So I tried setting them by rotating the original edge. The output now draws something, though I'm pretty sure thats not a Delaunay triangulation. I updated the Codepen example with the progress.

Javascript: Creating an array of arrays

I am trying to create an array of four arrays.
Each of this four arrays consists of three numbers, two of them are randomly assigned from a set of numbers.
When I run the following code I don't get an error, but I also don't get a result.
What am I missing?
I don't really need the print out in console.log, this is just to check if the array is constructed correctly
var x = -2;
function createEnemy(){
var yArray = [60,145,230];
var speedArray = [30,45,55,60];
var randY = Math.floor(Math.random() * yArray.length);
var randSpeed = Math.floor(Math.random() * speedArray.length);
var enemy = [yArray[randY], speedArray[randSpeed], x];
}
function printEnemies()
{
var allEnemies = [];
(function setEnemies()
{
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
}());
for(var j in allEnemies)
{
for(var p in allEnemies[j] )
{
for(var i = 0; i < allEnemies[j][p].length; i++ )
{
console.log(allEnemies[j][p][i]);
}
}
}
}
printEnemies();

You forgot to return your enemy :)
function createEnemy() {
var yArray = [60,145,230];
var speedArray = [30,45,55,60];
var randY = Math.floor(Math.random() * yArray.length);
var randSpeed = Math.floor(Math.random() * speedArray.length);
var enemy = [yArray[randY], speedArray[randSpeed], x];
return enemy;
}

Make sure you return something from createEnemy:
return [yArray[randY], speedArray[randSpeed], x];
Also, you might prefer something like this loop to the nested one you've implemented:
allEnemies.forEach(function (arr) {
console.log(arr[0], arr[1], arr[2]);
});

Looks like you're missing a 'return enemy' from the createEnemy function and you have an unnecessary tertiary level loop. Here's some modified lines (with some indentation updates for readability).
CODE:
var x = -2;
function createEnemy() {
var yArray = [60,145,230];
var speedArray = [30,45,55,60];
var randY = Math.floor( Math.random() * yArray.length );
var randSpeed = Math.floor( Math.random() * speedArray.length );
var enemy = [yArray[randY], speedArray[randSpeed], x];
return enemy; // Added a return of the enemy.
}
function printEnemies() {
var allEnemies = [];
( function setEnemies() {
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
allEnemies.push(createEnemy());
}()
);
for(var j in allEnemies) {
for(var p in allEnemies[j] ) {
console.log (allEnemies [j][p] ); // Removed additional depth of loop
}
}
}
printEnemies();

Use anonyous function in object for more than one task

I've got an Object "region" (will be different regions in the world), and I'm going to have an array of them with various properties that I apply.
I'd like the list of objects to contain the code to do various things like normalise the internal data, and add weights.
Here i have TTT (total travel time), TJL (total journey length) and PeaceIndex (how dangerous somewhere is) as properties.
Once I have the whole list I'm going to rank them against each other normalised to start with.
function region(TTT, TJL, peaceIndex) {
var n = function (TTTtopvalue,TTTbottomvalue,TTT) {
var colVal = parseFloat(TTT);
var numerator = colVal - TTTbottomvalue; //Once you have the extremes 33, 55, 56, 77 e.g. 33 and 77 then (value-min)/(max-min) 55-33=22/77-33= 22/50 = .4 whatever
var denominator = TTTtopvalue - TTTbottomvalue;
var result = numerator/denominator
this.TTTnormal =result ;
}
this.TTT = TTT;
this.TJL = TJL;
this.TTTnormal = 0;
this.TTTtopvalue = 0;
this.TTTbottomvalue = 0;
this.peaceIndex = peaceIndex;
this.normaliseTTT = n;
}
var r1 = new region(45, 33, 50);
var r2 = new region(40, 30, 55);
var r3 = new region(333, 100, 1);
var testArray = [r1, r2, r3];
console.log(JSON.stringify(testArray));
testArray[0].TTTtopvalue = 333;
testArray[0].TTTbottomvalue = 40;
testArray[0].normaliseTTT(333,40,45); //this works for TTT!!
console.log(JSON.stringify(testArray));
testArray.sort(function(a, b){
return a.TTT-b.TTT
})
console.log(JSON.stringify(testArray));
Now that works great for the TTT column. However it is the same code for the TJL and peaceIndex columns.
I just can't seem to get that anonymous function to return the normalised value to the other properties.
How can I do this?
So the prototype would be
function (topvalue,bottomvalue,TTT or TJL or peaceIndex)
Save typing the thing out each time

Separation of concerns is the answer. You need a separate class that represents a normalized value.
function NormalizedValue(value, top, bottom) {
this.init(value, top, bottom);
}
NormalizedValue.prototype.init = function (value, top, bottom) {
value = parseFloat(value);
top = parseFloat(top);
bottom = parseFloat(bottom);
this.value = value;
this.normalized = (value - bottom) / (top - bottom);
}
then
function Region(name) {
this.name = name;
this.TTT = new NormalizedValue();
this.TJL = new NormalizedValue();
this.peaceIndex = new NormalizedValue();
}
var r1 = new Region("A");
var r2 = new Region("B");
var r3 = new Region("C");
r1.TTT.init(333, 40, 45);
r1.TJL.init(40, 30, 25);
r1.peaceIndex.init(1, 5, 1);
// and so on for the others...
and then, for example
testArray.sort(function (a, b) {
return a.TTT.normalized - b.TTT.normalized;
});
You can structure your Region constructor differently so that more of the init values can be passed as arguments, but take care that it does not get too messy (a 10-argument constructor isn't a pretty thing).