新年来临之前，业务需求要求整一个烟花特效

新年来临之前，业务需求要求整一个烟花特效，对canvas研究不多，翻遍GitHub，找到了一个合眼缘的烟花效果，拿到源码了咱们来根据需求进行特制改造。 此库的效果展示，甚合我心，在情人节前夕，分享给各位有心人。

1.结合cursor达成业务需求

  最终效果

2.结合cursor快速理解源码

只研究烟花特效

• 将sound去掉
• 将state去掉
• 只保留canvas元素

1. 分12种烟花效果

 const shellTypes = {
    Random: randomShell,  //随机 剩余11种里边随机挑选一种
    Crackle: crackleShell, // 裂纹
    Crossette: crossetteShell, 
    Crysanthemum: crysanthemumShell, //菊花型
    "Falling Leaves": fallingLeavesShell,
    Floral: floralShell,
    Ghost: ghostShell, //幽灵效果
    "Horse Tail": horsetailShell,
    Palm: palmShell, //棕榈型
    Ring: ringShell, //环形
    Strobe: strobeShell, //闪烁效果
    Willow: willowShell, //柳树型
  }
  //因为是白色背景的烟花，换成其他颜色，根据业务需要搭配色值
  const COLOR = {
    Pink: "#FFEAB2",
    Yellow: "#F6FF3D",
    Orange: "#FF7E3D",
  };

1. Crackle：

1. Crossette：

1. Crysanthemum

1. Falling Leaves

1. Floral

1. Ghost

1. Horse Tail
   
2. 作者：高台树色
   链接：https://juejin.cn/post/7469992360518385715
   来源：稀土掘金
   著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。