canvas心形线条聚集表白动画效果代码-html代码-BFW代码库

canvas心形线条聚集表白动画效果代码

代码语言：html

所属分类：表白

代码描述：canvas心形线条聚集表白动画效果代码

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

<!doctype html>
<html>

<head>
    <meta charset="utf-8">

</head>

<body>
    <canvas id="heart"></canvas>

    <script>
        window.requestAnimationFrame = window.__requestAnimationFrame || window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || (function() {
    return function(a, c) {
        var d = c.__lastTime;
        if (d === undefined) {
            d = 0
        }
        var b = Date.now();
        var e = Math.max(1, 33 - (b - d));
        window.setTimeout(a, e);
        c.__lastTime = b + e
    }
})();
window.isDevice = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(((navigator.userAgent || navigator.vendor || window.opera)).toLowerCase()));
var loaded = false;
var init = function() {
    if (loaded) {
        return
    }
    loaded = true;
    var p = window.isDevice;
    var n = p ? 0.5 : 1;
    var a = document.getElementById("heart");
    var c = a.getContext("2d");
    var A = a.width = n * innerWidth;
    var j = a.height = n * innerHeight;
    var t = Math.random;
    c.fillStyle = "rgba(0,0,0,1)";
    c.fillRect(0, 0, A, j);
    var h = function(e) {
        return [Math.pow(Math.sin(e), 3), -(15 * Math.cos(e) - 5 * Math.cos(2 * e) - 2 * Math.cos(3 * e) - Math.cos(4 * e))]
    };
    var u = function(k, x, y, e, i) {
        return [e + k[0] * x, i + k[1] * y]
    };
    window.addEventListener("resize", function() {
        A = a.width = n * innerWidth;
        j = a.height = n * innerHeight;
        c.fillStyle = "rgba(0,0,0,1)";
        c.fillRect(0, 0, A, j)
    });
    var z = p ? 20 : 50;
    var q = [];
    var l;
    var d = p ? 0.3 : 0.1;
    for (l = 0; l < Math.PI * 2; l += d) {
        q.push(u(h(l), 210, 13, 0, 0))
    }
    for (l = 0; l < Math.PI * 2; l += d) {
        q.push(u(h(l), 150, 9, 0, 0))
    }
    for (l = 0; l < Math.PI * 2; l += d) {
        q.push(u(h(l), 90, 5, 0, 0))
    }
    var g = q.length;
    var v = [];
    var r = function(e, i) {
        for (l = 0; l < q.length; l++) {
            v[l] = [];
            v[l][0] = e * q[l][0] + A / 2;
            v[l][1] = i * q[l][1] + j / 2
        }
    };
    var f = [];
    for (l = 0; l < g; l++) {
        va.........完整代码请登录后点击上方下载按钮下载查看