js实现canvas粒子神经网络可视化动画效果代码-html代码-BFW代码库

js实现canvas粒子神经网络可视化动画效果代码

代码语言：html

所属分类：粒子

代码描述：js实现canvas粒子神经网络可视化动画效果代码

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

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

<head>

    <meta charset="UTF-8">





    <style>
        canvas {
        	position: absolute;
        	top: 0;
        	left: 0;
        }
    </style>




</head>

<body>
    <canvas id=c></canvas>


    <script>
        var w = c.width = window.innerWidth,
        h = c.height = window.innerHeight,
        ctx = c.getContext('2d'),
        
        opts = {
        
          range: 180,
          baseConnections: 3,
          addedConnections: 5,
          baseSize: 5,
          minSize: 1,
          dataToConnectionSize: .4,
          sizeMultiplier: .7,
          allowedDist: 40,
          baseDist: 40,
          addedDist: 30,
          connectionAttempts: 100,
        
          dataToConnections: 1,
          baseSpeed: .04,
          addedSpeed: .05,
          baseGlowSpeed: .4,
          addedGlowSpeed: .4,
        
          rotVelX: .003,
          rotVelY: .002,
        
          repaintColor: '#111',
          connectionColor: 'hsla(200,60%,light%,alp)',
          rootColor: 'hsla(0,60%,light%,alp)',
          endColor: 'hsla(160,20%,light%,alp)',
          dataColor: 'hsla(40,80%,light%,alp)',
        
          wireframeWidth: .1,
          wireframeColor: '#88f',
        
          depth: 250,
          focalLength: 250,
          vanishPoint: {
            x: w / 2,
            y: h / 2 } },
        
        
        
        squareRange = opts.range * opts.range,
        squareAllowed = opts.allowedDist * opts.allowedDist,
        mostDistant = opts.depth + opts.range,
        sinX = sinY = 0,
        cosX = cosY = 0,
        
        connections = [],
        toDevelop = [],
        data = [],
        all = [],
        tick = 0,
        totalProb = 0,
        
        animating = false,
        
        Tau = Math.PI * 2;
        
        ctx.fillStyle = '.........完整代码请登录后点击上方下载按钮下载查看