在纯javascript中使用processing.js时，导入processing.webgl用于3d画布

Importing processing.webgl for 3d canvas when using processing.js in pure javascript

本文关键字：processing 导入 webgl 用于 画布 3d js javascript 在纯      更新时间：2023-09-26

我想在processing.js.中使用一些3D形状

我发现，如果我使用处理"语言"，我可以只使用

import processing.webgl.*

编译器将忽略import语句。

然而，我目前正在用纯javascript进行编码，我不清楚如何做到这一点。

有人能帮忙吗？

编辑

为了更准确地描述我的问题，我的设置函数看起来像这样：

p.setup = function() {
    p.size(100, 100, P3D);
}

我收到P3D是未定义的

Processing v.s.Processing.js中绘制3D形状的过程几乎相同。如果你只在Processing.js中开发，你不需要导入任何东西。相反，当你调用size:时，只需传递P3D、OPENGL或WEBGL

void setup(){
  size(100, 100, P3D); // Can also be OPENGL or WEBGL
  translate(width/2, height/2);
  box(20);
}

编辑

以下是一些纯JavaScript中使用Processing.js的HTML（代码来自：http://js.processing.org/learning)

<script src="processing.js"></script>
<canvas id="cvs"></canvas>
<script>
function sketchProc(p) {
  // It makes more sense to use WEBGL if only developing in JavaScript
  p.size(100, 100, p.WEBGL);
  p.translate(p.width/2, p.height/2);
  p.box(20);
}
var canvas = document.getElementById("cvs");
var pjs = new Processing(canvas, sketchProc);
</script>

所以我所需要做的就是更改我的size()调用，使其看起来像这样：

p.size(100, 100, p.P3D);

我需要通过处理对象p.P3D来访问P3D常量。

相关文章：