出于我的目的,元素坐标除以75可以得到我想要的厚度。 厚度永远不会变得太厚,也永远不会完全消失。 但是您可以根据需要进行调整。 我还为每个笔触变量使用了一个不同的元素,因此每个多边形的笔触都会略有不同。
然后,包装我的setinterval函数,并写入多边形div的innerHTML。 这是根据新坐标使用新多边形每20毫秒刷新和更新DOM。 这看起来似乎过多。 但是无所谓。 它实际上只是一个启动页面,所以我不太担心。 这是整个代码的样子:
setInterval(function(){
let element1 = site1.getBoundingClientRect();
let element2 = site2.getBoundingClientRect();
let element3 = site3.getBoundingClientRect();
let element4 = site4.getBoundingClientRect();
let element5 = site5.getBoundingClientRect();
let element6 = site6.getBoundingClientRect();
let element7 = site7.getBoundingClientRect();
let stroke1 = element2.x / 75;
let stroke2 = element4.x / 75;
let stroke3 = element7.x / 75;
let stroke4 = element3.x / 75;
let polygon1 = `
`
document.getElementById('polygon').innerHTML = polygon1;
}, 20);