Quark-Renderer----第十二篇

2021SC@SDUSC

总述

我们在上节讨论了quark-renderer在事件方面的一些代码函数,有通过对鼠标触控等一系列的操作需要涉及点击、移入、移出、滚轮滑动等操作,对于事件的封装,介绍了他们的一些操作的实现过程。

那么本次,我们介绍对于geometric包中的代码。

geometric是几何,该包中包含有两个js文件,这两个js文件主要介绍点和直线,他不是实际的点和直线,他由他存在的意义,下面我们分别来介绍这点和线。

几何意义上的点

在GeoPoint.js文件中,我们对于集合意义上的点进行整理概括,作者对于他的定义是这样说的,它不可见,没有大小,用来进行数学运算。作者说的这样的点不是实际意义的点,我们通过下面的代码分析来完成对几何意义上的点的解读。

在js中,该js文件的主要作用就是导出一个GeoPoint类,该类实现对于几何意义上的点的定义实现。

首先,我们看构造函数,接收x,y,作为点的坐标。

Load(o)函数

而后有一个静态的load函数,该函数的作用为新建一个GeoPoint实例对象,传入的参数为一个json对象那个,包含x,y,返回一个GeoPoint对象。

  static load(o) {
    
    
    return new GeoPoint(Number(o.x), Number(o.y));
  }
loadArray(v)函数

下面来看loadArray函数,该函数也是一个静态的函数,传入的是一个Json对象,返回的是一个GeoPoint的对象数组。主要就是循环遍历v中的每一个值,然后调用load函数,进行构建newPoint。

  static loadArray(v) {
    
    
    let newPoints = [];
    for (let i = 0; i < v.length; i++) {
    
    
      newPoints.push(GeoPoint.load(v[i]));
    }
    return newPoints;
  }
cloneArray(v)

与loadArray函数对应的还有cloneArray(v)函数,该函数的结果也是返回一个GeoPoint的数组对象,他主要的操作就是调用了clone函数,以下是这两个函数的代码:

 clone() {
    
    
    let newPoint = new GeoPoint(this.x, this.y);
    return newPoint;
  }
  static cloneArray(v) {
    
    
    let newPoints = [];
    for (let i = 0; i < v.length; i++) {
    
    
      newPoints.push(v[i].clone());
    }
    return newPoints;
  }

在cloneArray函数中,通过循环调用了clone函数,实现了通过循环遍历,克隆点,并将点push进数组中。

pointsToArray(points)方法

而后对应点的下一个方法为转化点,该函数的作用是将点的对象转化为一个数组的形式存储。

扫描二维码关注公众号,回复: 15117412 查看本文章
  static pointsToArray(points) {
    
    
    let result = [];
    for (let i = 0; i < points.length; i++) {
    
    
      result.push([points[i].x, points[i].y]);
    }
    return result;
  }
equals(point)、near(x,y,radius)

还有一个判断当前点是否与另一个点相等的方法,该方法通过比较传入参数的点与当前点的x、y坐标是否相等来判断这两个点相同。

  equals(anotherPoint) {
    
    
    return this.x == anotherPoint.x && this.y == anotherPoint.y;
  }

上面的equals方法是用来判断当前点与传入的点是否为同一个,而下面这个方法则是用来测试某个点(x,y)是否处于当前GeoPoint的某个范围内。主要是通过常用的距离公式计算的两个点之间的距离,如果小于radius值,则在返回内,返回为true,否则返回为false。

  near(x, y, radius) {
    
    
    let distance = Math.sqrt(Math.pow(this.x - x, 2) + Math.pow(this.y - y, 2));
    return distance <= radius;
  }
add(point)

同时,这个js类中还有对于抽象点的加法,通过传入一个点的坐标,加上当前点的坐标,更新当前的点的坐标,并将这个函数返回。

 add(point) {
    
    
    this.x = this.x + point.x;
    this.y = this.y + point.y;
    return this;
  }

由于对于几何意义上的直线,他的代码比较多,本篇分析不完,我们将留到下篇进行学习。
但是几何逻辑线需要用到几何意义上的点进行标识,对于他俩之间的联系,我们下篇将进行详细介绍。

总结

本篇我们主要对于几何意义上的点进行了比较,通过分析了该GeoPoint类的一些方法属性,我们对该类有了深刻的认知,然后我们下次将主要分析几何学意义上的直线,同时对于两者之间的关系进行分析讨论。

猜你喜欢

转载自blog.csdn.net/qq_53259920/article/details/121912839
今日推荐