三维长方体空间穿越视觉效果

代码语言:html

所属分类:三维

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>a5</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            background: black;
            overflow: hidden;
        }
    </style>
    <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.109.js"></script>
    <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/TweenMax.min.js"></script>

</head>
<body>
    <script>
        var isMouseDown = false;
        var emptySlot = "emptySlot", planeTop = "planeTop", planeBottom = "planeBottom";
        var camera, scene, renderer;
        var mouse = {
            x: 0,
            y: 0
        };
        var camPos = {
            x: 0,
            y: 0,
            z: 10
        };
        var sw = window.innerWidth, sh = window.innerHeight;
        var cols = 20;
        var rows = 16;
        var gap = 20;
        var size = {
            width: 100,
            height: 30,
            depth: 150,
        }
        var planeOffset = 250;
        var allRowsDepth = rows * (size.depth + gap);
        var allColsWidth = cols * (size.depth + gap);

        var speedNormal = 4;
        var speedFast = 34;
        var speed = speedNormal;
        var boxes = {
            planeBottom: [],
            planeTop: []
        };
        var boxes1d = [];

        function num(min, max) {
            return Math.random() * (max - min) + min;
        }
        function draw(props) {

            var colours = {
                slow: {
                    r: num(0, 0.2),
                    g: num(0.5, 0.9),
                    b: num(0.3, 0.7)
                },
                fast: {
                    r: num(0.9, 1.0),
                    g: num(0.1, 0.7),
                    b: num(0.2, 0.5)
                }
            }

            var uniforms = {
                r: {
                    type: "f",
                    value: colours.slow.r
                },
                g: {
                    type: "f",
                    val.........完整代码请登录后点击上方下载按钮下载查看

网友评论0