Javascript 如何在VR（虚拟现实）图像上绘制3D点

我试图理解从世界上的三维点（x，y，z）到二维图像上的虚拟表示的公式

我使用此页面作为示例：

如何从球的真实（x，y，z）位置获得（a，b）位置

如果您查看页面，会发现很多有趣的信息：

REAL WORLD POSITION (from html source)
X:  -11.8872
Y:  -5.4864
Y:  0.0

VR CAMERA 2 INFORMATION (from javascript projection.js)
height: 290
width:  578
y:  2.14571658875068
p:  -1.86560642719269
tx: 27.0765197103578
ty: 16.2179742216193
tz: 10.4983372879028
r:  0.0
ar: 1.0
fl: 445.122161865234
cx: 289
cy: 145

2D LOCATION (from live inspection of page in browser inspector)
A:  121.9715646498276
B:  193.3313740587937

• 该页面使用此3D库

• 球由（x，y，0）位置表示，例如“VR摄像机[1-4]”视图：

• 网络的中间似乎是（0，0，0）

• 在上述示例中，四个球是：

  -11.8872, 5.4864, 0 (the ball on the tennis double line)
  0, 0, 0 (the ball in the middle of the net)
  6.4008, 0, 0 (the ball at the T serve line)
  -11.8872,-5.4864, 0  (the ball on the other tennis double line)
  

• projection.js文件包含以下内容：

  onProjections([{
  "sp":{"height":290,"width":288,"y":1.57271656153463,"p":-2.37960648536682,"tx":44.8464085506826,"ty":0.072299872443644,"tz":43.6183372879028,"r":0.0,"ar":1.0,"fl":1876.41418457031,"cx":144,"cy":145},
  "rsp":{"height":290,"width":288,"y":1.56934654388598,"p":-2.26160676579457,"tx":32.6921108381257,"ty":0.227987701481753,"tz":19.2898811340332,"r":0.0,"ar":1.0,"fl":557.320129394531,"cx":144,"cy":145},
  "p":{"height":290,"width":288,"y":1.57234654402847,"p":-2.01060693582986,"tx":40.2668354447684,"ty":0.0886826017731878,"tz":15.4698811340333,"r":0.0,"ar":1.0,"fl":1027.31091308594,"cx":144,"cy":145},
  "vr-4":{"height":290,"width":578,"y":-3.14002369728572,"p":-3.14159274101257,"tx":0.0720691962205988,"ty":-0.237841598739008,"tz":144.869881134034,"r":0.0,"ar":1.0,"fl":1735.24694824219,"cx":289,"cy":145},
  "vr-3":{"height":290,"width":578,"y":3.13971663596315,"p":-1.80660665035248,"tx":-0.0380399327222413,"ty":21.4384628442103,"tz":8.04833728790282,"r":0.0,"ar":1.0,"fl":333.111877441406,"cx":289,"cy":145},
  "vr-2":{"height":290,"width":578,"y":2.14571658875068,"p":-1.86560642719269,"tx":27.0765197103578,"ty":16.2179742216193,"tz":10.4983372879028,"r":0.0,"ar":1.0,"fl":445.122161865234,"cx":289,"cy":145},
  "vr-1":{"height":290,"width":578,"y":1.56571656120214,"p":-1.88360643386841,"tx":37.1591340096487,"ty":-0.0542132391350438,"tz":10.9683372879027,"r":0.0,"ar":1.0,"fl":787.308471679688,"cx":289,"cy":145},
  "rhp":{"height":290,"width":288,"y":1.57134654398098,"p":-2.25760674476624,"tx":31.4921270358275,"ty":0.153327426083581,"tz":18.0298811340332,"r":0.0,"ar":1.0,"fl":557.320129394531,"cx":144,"cy":145}
  }]);
  

我想我的问题归结为如何使用projection.js中的数据从（x，y，z）位置计算（a，b）位置？请注意，我正在尝试获取公式，我对javascript库不太感兴趣，因为我将不得不使用不同的工具进行实现

编辑#1:

视图数据似乎包括：高度、宽度、y（偏航）、p（平移）、tx、ty、tz（摄像机位置）、r（滚动）、ar（？？，始终为1）、fl（焦距？？），cx、cy（图像中心？？）

本页给出了一个公式，但不包括偏航：

如果我在VR相机2上考虑网球双线上的球，我有以下信息：

REAL WORLD POSITION (from html source)
X:  -11.8872
Y:  -5.4864
Y:  0.0

VR CAMERA 2 INFORMATION (from javascript projection.js)
height: 290
width:  578
y:  2.14571658875068
p:  -1.86560642719269
tx: 27.0765197103578
ty: 16.2179742216193
tz: 10.4983372879028
r:  0.0
ar: 1.0
fl: 445.122161865234
cx: 289
cy: 145

2D LOCATION (from live inspection of page in browser inspector)
A:  121.9715646498276
B:  193.3313740587937

什么是函数（A，B）=f（X，Y，Z，高度，宽度，Y，p，tx，ty，tz，r，ar，fl，cx，cy）？

计算偏航：

x_new = x * cos (yaw) - y * sin (yaw)
y_new = x * sin (yaw) + y * cos (yaw)

x_new = x * cos (yaw) - y * sin (yaw)
y_new = x * sin (yaw) + y * cos (yaw)