d3.v5实现洛伦茨吸引子图鼠标交互动画效果代码-html代码-BFW代码库

d3.v5实现洛伦茨吸引子图鼠标交互动画效果代码

代码语言：html

所属分类：动画

代码描述：d3.v5实现洛伦茨吸引子图鼠标交互动画效果代码

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


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

<head>

  <meta charset="UTF-8">
  

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/modernizr.2.8.3.js"></script>
  
  
<style>
@import url(https://fonts.googleapis.com/css?family=Ubuntu:400,700);
body {
  background: #000;
  height:100vh; 
  font-family: 'Ubuntu', sans-serif;
}
.intro{
  text-align:center;
	background:rgba(155, 89, 182,0.7);
  top:0; 
	padding:1em;
}
h1{ 
	color:#fff; 
	font-size:1.5em;
}
h3{
  font-size:1em;
  color:#fff;
}
</style>


</head>



<body>
  <div class='intro'>
    <h1>The Lorenz Attractor</h1>
    <h3>Move Your Mouse Around...</h3>
 </div>


<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/d3.v3.3.5.17.js"></script>
      <script>

	var dt = 0.005, // (δτ) Represents time. Draw curve - higher the value, straighter the lines
    p = 28, // (ρ) point of origin
    w = 10,  // (σ)width of main element - higher the number, narrower the width
    beta = 8 / 3,  // (β) points of equilibrium - this applied value results in the infinity symbol. higher values will break the equilibrium, causing the ends to separate and spread. When ρ = 28, σ = 10, and β = 8/3, the Lorenz system has chaotic solutions; it is this set of chaotic solutions that make up the Lorenz Attractor (the infinity symbol).  If ρ < 1 then there is only one equilibrium point, which is at the origin. This point corresponds to no convection. All orbits converge to the origin when ρ  < 1.  The 'fork' occurs at ρ = 1, or ρ > 1 Try it. 
      
	//Below x, y, and z values are the components of a given three dimensional location in space
    x0 = .5,   //change in x,y, or z with respect to time
    y0 = .5,   //"                                       "
    z0 = 10;   //"            .........完整代码请登录后点击上方下载按钮下载查看