three+quicksettings实现可配参数旋涡飓风动画效果代码

代码语言:html

所属分类:动画

代码描述:three+quicksettings实现可配参数旋涡飓风动画效果代码

代码标签: three quicksettings 参数 旋涡 飓风 动画

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

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">




    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/quicksettings_minimal.css">

    <style>
        body {
            background:#202020;
        }
        
        #logo-anim {
            width:100%;
            height: 500px;
        }
    </style>




</head>

<body>

    <div id="logo-anim"></div>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.2.11.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/TweenMax.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.72.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/quicksettings.min.js"></script>
    <script>
        $(function () {
          "use strict";
        
          var weatherPressure = 0;
          var weatherSpeed = 0;
          var settings = null;
        
        
        
          // should have weather data or defaults in place
        
          // assuming jquery loaded
          var container = $("#logo-anim");
          var containerW = container.width();
          var containerH = container.height();
        
          var scene;
          var camera;
          var renderer;
        
        
        
        
          var uisettings = {
            AtmosPressure: weatherPressure,
            WindSpeed: weatherSpeed };
        
        
          $(document).ready(function () {
        
            // ui 
            initUI();
        
            // start anim
            initAnim();
          });
        
        
        
          function initUI() {
            settings = QuickSettings.create();
            settings.setGlobalChangeHandler(uiChange);
            settings.bindRange("AtmosPressure", 0, 1, weatherPressure, 0.01, uisettings);
            settings.bindRange("WindSpeed", 0, 1, weatherSpeed, 0.01, uisettings);
            settings.addButton("APPLY WEATHER.........完整代码请登录后点击上方下载按钮下载查看

网友评论0