canvas-nest.min.js 3.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. /*
  2. * @Author: aliyun0758874076 2300202994@qq.com
  3. * @Date: 2023-08-30 11:07:46
  4. * @LastEditors: aliyun0758874076 2300202994@qq.com
  5. * @LastEditTime: 2023-09-14 17:28:02
  6. * @FilePath: \公司发展事件时间轴js特效\js\canvas-nest.min.js
  7. * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  8. */
  9. !(function () {
  10. function o (w, v, i) {
  11. return w.getAttribute(v) || i
  12. }
  13. function j (i) {
  14. return document.getElementsByTagName(i)
  15. }
  16. function l () {
  17. var i = j('script'),
  18. w = i.length,
  19. v = i[w - 1]
  20. return {
  21. l: w,
  22. z: o(v, 'zIndex', 999),
  23. o: o(v, 'opacity', 1), // 控制透明度
  24. c: o(v, 'color', '255,255,255'),
  25. n: o(v, 'count', 299) // 控制数量
  26. }
  27. }
  28. function k () {
  29. r = u.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth, n = u.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
  30. }
  31. function b () {
  32. e.clearRect(0, 0, r, n)
  33. var w = [f].concat(t)
  34. var x, v, A, B, z, y
  35. t.forEach(function (i) {
  36. i.x += i.xa, i.y += i.ya, i.xa *= i.x > r || i.x < 0 ? -1 : 1, i.ya *= i.y > n || i.y < 0 ? -1 : 1, e.fillRect(i.x - 0.5, i.y - 0.5, 1, 1)
  37. for (v = 0; v < w.length; v++) {
  38. x = w[v]
  39. if (i !== x && x.x !== null && x.y !== null) {
  40. B = i.x - x.x, z = i.y - x.y, y = B * B + z * z
  41. y < x.max && (x === f && y >= x.max / 2 && (i.x -= 0.03 * B, i.y -= 0.03 * z), A = (x.max - y) / x.max, e.beginPath(), e.lineWidth = A / 2, e.strokeStyle = 'rgba(' + s.c + ',' + (A + 0.2) + ')', e.moveTo(i.x, i.y), e.lineTo(x.x, x.y), e.stroke())
  42. }
  43. }
  44. w.splice(w.indexOf(i), 1)
  45. }), m(b)
  46. }
  47. var u = document.createElement('canvas'),
  48. s = l(),
  49. c = 'c_n' + s.l,
  50. e = u.getContext('2d'),
  51. r, n, m = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (i) {
  52. window.setTimeout(i, 1000 / 45)
  53. },
  54. a = Math.random,
  55. f = {
  56. x: null,
  57. y: null,
  58. max: 20000
  59. }
  60. u.id = c
  61. u.style.cssText = 'position:fixed;top:0;pointer-events:none;left:0;z-index:' + s.z + ';opacity:' + s.o
  62. j('body')[0].appendChild(u)
  63. k(), window.onresize = k
  64. window.onmousemove = function (i) {
  65. i = i || window.event, f.x = i.clientX, f.y = i.clientY
  66. }, window.onmouseout = function () {
  67. f.x = null, f.y = null
  68. }
  69. for (var t = [], p = 0; s.n > p; p++) {
  70. var h = a() * r,
  71. g = a() * n,
  72. q = 2 * a() - 1,
  73. d = 2 * a() - 1
  74. // console.log(r,n) // 屏幕的大小
  75. // console.log(q,d) // 初始的位置偏移量
  76. t.push({
  77. x: h,
  78. y: g,
  79. xa: q,
  80. ya: d,
  81. max: 9000
  82. })
  83. }
  84. setTimeout(function () {
  85. b()
  86. }, 10)
  87. }())