zoukankan      html  css  js  c++  java
  • pixijs制作3D效果

    pixijs制作3D效果

        const app = new PIXI.Application({  750, height: 1206 });
        document.body.appendChild(app.view);
    
    var camera = new PIXI.projection.Camera3d();
    camera.position.set(app.screen.width / 2, app.screen.height / 2);
    camera.setPlanes(1000, 100, 10000, true);
    app.stage.addChild(camera);
    
    
       var  sprite1 = new PIXI.projection.Sprite3d(PIXI.Texture.from('/moban/images/closebtn1.png'));
            sprite1.anchor.set(0.5, 0.5);
       
              sprite1.position3d.set(0,0);
              sprite1.euler.y=26;
      var tm = new TimelineMax();
           // tm.to($('.ddd1'), 3, {left:300,delay:0,repeat: 1, yoyo: true,repeatDelay: 1,ease: Linear.easeNone});//将一个动画添加到时间轴
           // tl.add(tm);//将一个动画添加到时间轴
           // 
          tm.to(sprite1.euler, 30, {y:360,delay:0,repeat: 2, yoyo: true,ease: Linear.easeNone});//将一个动画添加到时间轴     
              // sprite1.euler.z=40;
      camera.addChild(sprite1);

    需要注意 他这个需要把精灵父精灵都是摄像机才行

    做做简单的3D效果还行 做复杂的还是用threejs吧

  • 相关阅读:
    jQuery的选择器
    01-jQuery的介绍
    client、offset、scroll系列
    BOM
    定时器
    js中的面向对象
    javascript小练手
    DOM介绍
    关于DOM的事件操作
    伪数组 arguments
  • 原文地址:https://www.cnblogs.com/newmiracle/p/13873725.html
Copyright © 2011-2022 走看看