Javascript 滚动时填充SVG笔划，向上滚动时移除填充

我试图在网页上绘制虚线SVG笔划，需要在向下滚动时填充该笔划，在再次向上滚动时缓慢移除填充颜色

下面是具有滚动效果的示例网站。我需要同样的效果。

下面是我的SVG文件代码

<svg xmlns="http://www.w3.org/2000/svg" width="802.354" height="3245.896" viewBox="0 0 802.354 3245.896">

---

我使用了两次路径。第一次使用

笔划dasharray=“8”

。第二次，use元素的

stroke dasharray

的值与路径的长度相同。我希望这就是你需要的

让l=Path_440.getTotalLength（）；
设dasharray=l；
设dashoffset=l；
fill.setAttributeNS（null，“stroke dasharray”，l）；
fill.setAttributeNS（null，“笔划偏移量”，l）；
wrap.addEventListener（“滚动”，函数（）{
dashoffset=l—this.scrollTop*l/（this.scrollHeight—this.clientHeight）；
fill.setAttributeNS（null，“笔划-dashoffset”，dashoffset）；
});
#换行{高度：100vh；溢出：滚动；}

您的
svg
不包含任何实际的视觉内容，因此您要求我们设计和实现您的svg，并告诉您如何在滚动中设置动画？除了浏览那个网站并说“我想要那个，但让别人去做”之外，你还做了什么吗？我在本地尝试了css和JavaScript，但看不到动画效果。然后请添加所有代码，以便我们可以指导你正确的方向：）你尝试的任何东西都可以帮助我们更好地帮助你！这是一个实心的笔划，但我需要填充卷轴上的虚线和向上卷轴上的虚线。默认虚线是浅色。我不明白你在说什么。请重新表述您的问题，并尝试用示例和代码解释您需要的一切