当我在设置中调用看似不相关的函数时，为什么我的随机向量生成器会创建 NaN 向量？

问题描述 投票：0回答：1

我正在制作一个算法，涉及在 P5.js 中生成随机点云。这是我的功能：

function generatePoints(amount) {
  function generatePoints(amount) {
  let points = []
  for(let i = 0; i < amount; i++) {
    let px = int(random(-width/4, width/4))
    let py = int(random(-height/4, height/4))
    print(px, py)
    let myPoint = createVector(px, py)
    print(myPoint)
    circle(px, py, 3)
    points.push(myPoint)
  }
  }
  return points
}

我有这样的

setup()
：

function setup() {
  createCanvas(400, 400);
  translate(offsetX,offsetY)
  background(220)
  let points = generatePoints(10)
  let hull = drawConvexHull(points)
  print(hull)
  //smallestRectColEdge(hull)
}

但是，如果我取消注释 

setup()
中的最后一行，一些点就会变成以 NaN 作为 x 和 y 值的向量，我不知道为什么！ 
smallestRectColEdge()
应该找到生成点云的凸包的最小边界矩形，据我所知，它的代码中没有任何内容与 
generatePoints()
交互，所以我被难住了。

如果有帮助，这里是当 

enter code here
未注释时从 
generatePoints()
随机生成的打印
smallestColRectEdge()

50 86 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: NaN, y: NaN…} 78 -32 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 78, y: -32…} -51 -94 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: NaN, y: NaN…} -70 -69 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -70, y: -69…} 90 -54 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: NaN, y: NaN…} -98 -78 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: NaN, y: NaN…} 26 -11 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 26, y: -11…} 29 -71 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 29, y: -71…} 58 48 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 58, y: 48…} 13 -30 _class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 13, y: -30…} 
然而，当我评论
smallestRectColEdge
时，一切似乎都很好。这是带有注释的运行程序的打印。


16 -90
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 16, y: -90…}
-61 68
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -61, y: 68…}
99 -13
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 99, y: -13…}
-78 43
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -78, y: 43…}
-41 86
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -41, y: 86…}
81 -3
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 81, y: -3…}
-16 52
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -16, y: 52…}
92 90
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 92, y: 90…}
-31 52
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: -31, y: 52…}
97 63
_class {isPInst: true, _fromRadians: ƒ bound (), _toRadians: ƒ bound (), x: 97, y: 63…}

问题也不在
drawConvexHull()
。随着 
smallestRectColEdge()
 的评论，我要求它打印作为参数给出的点数组和成为船体的点，而不是看到的 NaN。我不知道问题出在哪里，但通过消除，这是唯一可能出现问题的地方，所以这里是
smallestRectColEdge()
。


function smallestRectColEdge(hull){
  print(hull)
  angleMode(DEGREES)
  let angles = []
  let rotatedHulls = []
  let OBBs = []
  let smallestOBB
  
  //get all angles for rotating the hull
  for(let i = 0; i < hull.length; i++) {
    let angle = 0
    let diff = 0
    if(i < hull.length-1) {
      diff = p5.Vector.sub(hull[i+1], hull[i])
    } else {
      diff = p5.Vector.sub(hull[i], hull[0])
    }
    diff.normalize()
    angle = atan2(diff)
    
    let rotations = {
      rotAngle: angle,
      locAx: [diff, createVector(-diff.y, diff.x)]
    }
    
    angles.push(rotations)
  }
  
  //effectively rotating the hulls, and getting an OBB
  //out of each rotation
  
  for(i = 0; i < angles.length; i++) {
    let minX = 400
    let minY = 400
    let maxX = -400
    let maxY= -400
    let rotatedHull = [...hull]
    
    //rotating the hull
    rotatedHull.forEach((myPoint)=>{
      myPoint.rotate(angles[i].rotAngle)
    })
    
    //print(rotatedHull)
    
    //making the AABBs
    rotatedHull.forEach((myPoint)=>{
      if(minX > myPoint.x) {minX = myPoint.x}
      else if(maxX < myPoint.x) {maxX = myPoint.x}
      if(minY > myPoint.Y) {minY = myPoint.Y}
      else if(maxY < myPoint.y) {maxY = myPoint.y}
    })
    
    //print(minX, maxX, minY, maxY)
    
    let OBB = {
      mins: createVector(minX, minY),
      maxes: createVector(maxX, maxY),
      u: maxX-minX,
      v: maxY-minY,
      locAx: angles[i].locAx,
      area: (maxX-minX) * (maxY-minY)
    }
    
    //print(OBB)
    OBBs.push(OBB)
  }

这里还有一个
整个项目的链接（如果相关的话）。

这似乎与船体的操作方式有关，因为 NaN 向量的数量等于船体中的点，但如果是这种情况，
generatePoints()
中的打印函数应该打印出 NaN，因为点在稍后调用的函数中据说会变成 NaN？


尝试了什么：生成随机点云。
发生了什么：有些点变成了 NaN 向量。


编辑：更新了代码以获得更好的调试信息并添加了
smallestRectColEdge()
代码。

    



    
    javascript
    
    geometry
    
    p5.js
    
    computational-geometry
    
    
1个回答

    

      
      
      

        

          

            

              
0
投票

              
            

          

        

        
您的 
generatePoints
 函数中存在一些问题：


function generatePoints(amount) {
  function generatePoints(amount) {
  let points = []
  for(let i = 0; i < amount; i++) {
    let px = int(random(-width/4, width/4))
    let py = int(random(-height/4, height/4))
    print(px, py)
    let myPoint = createVector(px, py)
    print(myPoint)
    circle(px, py, 3)
    points.push(myPoint)
  }
  }
  return points
}



  • function generatePoints(amount)
     重复（嵌套）：可能是拼写错误
    

    • 在 JS 中最好避免变量名名称冲突（例如 
  • points
     / 
    POINTS
     等）
    

    • 如果您稍后重新渲染点，可能循环调用是多余的
  • 

    • 

这是一个带有函数重构版本的基本草图：






function setup() {
  createCanvas(400, 400);
  
  // generate points
  const numPoints = 10;
  let randomPoints  = generatePoints(numPoints);
  
  // render points
  beginShape();
  translate(width / 2, height / 2);
  for(let i = 0; i < numPoints; i++) {
    const myPoint = randomPoints[i];
    vertex(myPoint.x, myPoint.y);
  }
  endShape();
}

function generatePoints(amount) {
  let myPoints = [];
  for(let i = 0; i < amount; i++) {
    let px = int(random(-width/4, width/4));
    let py = int(random(-height/4, height/4));
    let myPoint = createVector(px, py);
    myPoints.push(myPoint);
  }
  return myPoints;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.9.0/p5.min.js"></script>






这甚至是在调查
smallestRectColEdge
之前。
感觉你可能走得太快了：有时，违反直觉地放慢速度反而会加快你的速度。尝试一次专注于一个函数，使用虚拟数据（甚至是处理案例的不良数据）对其进行彻底测试，然后转到下一个函数。这样，您将确信到目前为止所编写的内容按预期工作，并且如果/当出现新问题时，隔离问题会更容易（因为它将是最近添加的代码）。


（
p5.Vector.random2D()
也可能感兴趣）
    



      

      
    

  

  

    
最新问题


  





  

    © www.soinside.com 2019 - 2024. All rights reserved.