问题描述
我正在编写关于科里奥利效应的物理模拟。我让一个空心的圆形物体在物质js中连续旋转。但是,我想以与旋转体相同的速度旋转整个 matter.js 视图/浏览器视图。外面的空心圆圈正在旋转。我附上了一张图片和代码。任何建议将不胜感激。
let Engine = Matter.Engine,Render = Matter.Render,World = Matter.World,Bodies = Matter.Bodies,Composites = Matter.Composites;
Events = Matter.Events;
Body = Matter.Body;
Vector = Matter.Vector;
let engine = Engine.create();
let render = Render.create({
element: document.body,engine: engine
});
Engine.run(engine);
Render.run(render);
function containerpolygon(
x,y,sides,radius
) {
const width = 20;
const extraLength = 1.15;
const initialRotation = 0;
const theta = (2 * Math.PI) / sides;
const sideLength = ((2 * radius * theta) / 2) * extraLength;
const parts = [];
for (let i = 0; i < sides; i++) {
// We'll build thin sides and then translate + rotate them appropriately.
const body = Bodies.rectangle(0,sideLength,width);
Body.rotate(body,i * theta);
Body.translate(body,{
x: radius * Math.sin(i * theta),y: -radius * Math.cos(i * theta),});
parts.push(body);
}
const ret = Body.create({
isstatic: true,inertia: Infinity,// setting inertia to infinty will prevent rotation upon collision
rotationSpeed: 1,});
Body.setParts(ret,parts);
Body.translate(ret,{ x: x,y: y });
return ret;
}
engine.world.gravity.y = 0;
var objects = [];
let ball = Bodies.circle(400,300,10,{
frictionAir: 0,friction: 0,frictionStatic: 1,//restitution: 1,});
let rotating_circle = containerpolygon(400,100,250);
//initializing objects
objects.push(ball,rotating_circle);
// adding objects to array
World.add(engine.world,objects);
var trail = [];
Events.on(render,"afterRender",function () {
trail.unshift({
position: Vector.clone(ball.position),speed: ball.speed,});
Render.startViewTransform(render);
render.context.globalAlpha = 0.7;
for (var i = 0; i < trail.length; i += 1) {
var point = trail[i].position;
render.context.fillStyle = "red";
render.context.fillRect(point.x,point.y,2,2);
}
render.context.globalAlpha = 1;
Render.endViewTransform(render);
// if (trail.length > 2000) {
// trail.pop();
// }
});
function updateRotation() {
Matter.Body.setAngle(
rotating_circle,rotating_circle.angle + rotating_circle.rotationSpeed
);
requestAnimationFrame(updateRotation);
}
window.requestAnimationFrame(updateRotation);
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)