三个js -移动旋转轴

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);

function animate() {
    requestAnimationFrame(animate);

    // 移动轴
    axesHelper.position.x += 0.01;

    // 旋转轴
    axesHelper.rotation.y += 0.01;

    renderer.render(scene, camera);
}

animate();

const app = new PIXI.Application({ width: 800, height: 600 });
document.body.appendChild(app.view);

const axes = new PIXI.Graphics();
app.stage.addChild(axes);

function drawAxes() {
    axes.clear();
    axes.lineStyle(2, 0xffffff);
    axes.moveTo(0, 0);
    axes.lineTo(100, 0); // X轴
    axes.moveTo(0, 0);
    axes.lineTo(0, 100); // Y轴
}

drawAxes();

let x = 0;
let y = 0;
let angle = 0;

app.ticker.add(() => {
    // 移动轴
    x += 1;
    y += 1;

    // 旋转轴
    angle += 0.01;

    axes.clear();
    axes.lineStyle(2, 0xffffff);
    axes.moveTo(x, y);
    axes.lineTo(x + Math.cos(angle) * 100, y + Math.sin(angle) * 100); // X轴
    axes.moveTo(x, y);
    axes.lineTo(x + Math.sin(angle) * 100, y - Math.cos(angle) * 100); // Y轴
});