Html 在同一画布中绘制p5.js和babylon.js的元素
我想在画布上创建3D形状,但我正在使用Html 在同一画布中绘制p5.js和babylon.js的元素,html,html5-canvas,p5.js,babylonjs,Html,Html5 Canvas,P5.js,Babylonjs,我想在画布上创建3D形状,但我正在使用ml5.js和posenet示例。我可以想到两种方法: 方法1:使用WEBGL渲染器。但是,它不起作用。运行3d形状需要WEBGL渲染器,对吗?当我在ml5.js示例中使用它时,以下内容不起作用: createCanvas(640,480, WEBGL) 方法2:使用不同的库。我决定使用babylon.js 但它要求我先创建一个canvas元素,然后再进行diplay <canvas id="renderCanvas" touch-action=
ml5.js
和posenet
示例。我可以想到两种方法:
方法1:使用WEBGL渲染器。但是,它不起作用。运行3d形状需要WEBGL渲染器,对吗?当我在ml5.js示例中使用它时,以下内容不起作用:
createCanvas(640,480, WEBGL)
方法2:使用不同的库。我决定使用babylon.js
但它要求我先创建一个canvas元素,然后再进行diplay
<canvas id="renderCanvas" touch-action="none"></canvas>
var canvas = document.getElementById("renderCanvas"); // Get the canvas element
var engine = new BABYLON.Engine(defaultCanvas0, true); // Generate the BABYLON 3D engine
// Add the create scene function
var canvas=document.getElementById(“renderCanvas”);//获取canvas元素
var engine=新巴比伦。engine(defaultCanvas0,true);//生成巴比伦3D引擎
//添加“创建场景”功能
问题:p5创建的画布与babylon.js不同。我希望显示器是一个而不是两个单独的窗口。怎么做?谢谢大家! AFAIK不能在画布的同一webgl上下文上使用两个渲染器。 这意味着,您需要选择一个渲染器来绘制3D形状 画布创建可以是代码的一部分,因此您不必在HTML中已经有画布。Babylon.js只需在引擎的构造函数中绘制画布:
var canvas = document.createElement("canvas");
// style your canvas
canvas.style.width = "100px";
canvas.style.height = "100px";
// add to wherever you want
document.body.appendChild(canvas);
// use this canvas to init babylon
var engine = new BABYLON.Engine(canvas, true);
// do your thing!
您能否指定在WEBGL模式下无法工作的确切p5.js代码?