Как я могу сделать два случайных числа на определенном расстоянии друг от друга?

Question

Я новичок в программировании javascript, но я знаю, насколько грязный мой код, поэтому я сожалею об этом. То, что я пытаюсь сделать, это создать 2 (пока окончательная версия будет иметь много) «Деревья», которые являются просто прямоугольниками, теперь помещаются на случайное значение x. Но я не хочу, чтобы они находились в пределах 40 пикселей друг от друга. Я пытаюсь написать что-то, что должно это сделать, но я не могу понять, почему это не работает, деревья все еще нерестуют друг на друга! Это сводит меня с ума. Кстати, я использую p5js и возвышенный текст 2.

function bg(){ 
    var tree = Math.floor(Math.random() * (380 - 0) + 00); 
    var tree2 = Math.floor(Math.random() * (380 - 0) + 0); 
    redefine(tree,tree2); 
    this.x=0; 

    this.show = function(){ 
     noStroke(); 

     //tree 
     fill(102, 51, 0); 
     rect(this.x+tree , 450, 26, 110); 

     //tree2 
     fill(102, 51, 0); 
     rect(this.x+tree2, 410, 26, 150); 
    } 
} 

function redefine(first, second){ 
    if(second<=first-40 || second>=first+40){ 
     console.log("good"); 
    } else { 
     console.log("redefining") 
     second = Math.floor(Math.random() * (380 - 0) + 0); 
    } 
} 

//key 
// Math.random() * (max - min) + min  

Answer 1

Одна проблема заключается в том, что вы только давая вашей redefine функцию один шанс катиться другой случайный номер. Вы можете изменить его на цикл, который продолжает пытаться, пока они не будут на некотором расстоянии друг от друга.

Answer 2

В redefine вы пытаетесь изменить значение «second», но это не изменяет «tree2», потому что это примитивная переменная с локальным охватом. Предполагая, что ваша другая логика звук, что-то подобное может работать:

function bg(){ 


var tree = Math.floor(Math.random() * (380 - 0) + 00); 
var tree2 = Math.floor(Math.random() * (380 - 0) + 0); 

while(isOverlapping(tree, tree2)) { 
    tree2 = Math.floor(Math.random() * (380 - 0) + 0); 
} 

this.x=0; 

this.show = function(){ 
noStroke(); 

//tree 
fill(102, 51, 0); 
rect(this.x+tree , 450, 26, 110); 

//tree2 
fill(102, 51, 0); 
rect(this.x+tree2, 410, 26, 150); 
    } 
} 

function isOverlapping(first, second){ 
    if(second<=first-40 || second>=first+40){ 
     console.log("good"); 
     return false; 
    } else { 
     console.log("redefining") 
     return true; 
    } 
} 

Answer 3

Я бы предложил использовать «определить» подход вместо «переопределить»:

function bg() { 

    var tries = define(tree, tree2); 
    var tree = tries[0]; 
    var tree2 = tries[1]; 


    this.x = 0; 

    this.show = function() { 
    noStroke(); 

    //tree 
    fill(102, 51, 0); 
    rect(this.x + tree, 450, 26, 110); 

    //tree2 
    fill(102, 51, 0); 
    rect(this.x + tree2, 410, 26, 150); 
    } 

} 

function define() { 

    var tries  = []; 
     tries[0] = 0; 
     tries[1] = 0; 
    var i   = 0; 

    while(tries[1] - tries[0] <= 40 && tries[0] - tries[1] <= 40){ 

     tries[0] = Math.floor(Math.random() * (380 - 0) + 0); 
     tries[1] = Math.floor(Math.random() * (380 - 0) + 0);   
     i++; 
     console.info('iter:',i,' inside tree:',tries[0],' tree2:',tries[1]); 

    } 

    return tries; 
}