js实现canvas三色线条三维空间旋转动画效果代码
代码语言:html
所属分类:动画
代码描述:js实现canvas三色线条三维空间旋转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html>
<head>
<style>
body
{
background: #262626;
}
#c
{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body><canvas id="c" ></canvas>
<script>
// These have to be ordered by size (ascending) for them to be correctly drawn
var circles = [
{ color: '#21a5ad', size: 84, angle: Math.PI / 3 },
{ color: '#ffad10', size: 92, angle: - Math.PI / 3 },
{ color: '#ef4239', size: 100, angle: 0 }
];
// To be able to "twist a circle", it has to be defined as a set of linked points
// This is the number of these points (you can see it if you set it to 3 or 4)
var segmentsPerCircle = 200;
// Time scaling factor : slower w.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0