弹幕轨迹

1 .直接鼠标拖拽生成-可以直接得到svg轨迹，进行移动，但是不会很平滑
2 .还是生成贝塞尔曲线这样更好，可以得到平滑的移动曲线
3 .https://github.com/soswow/fit-curve 这个库来拟合输入的移动点
4 .占用大量资源的是svg路径动画，所以还是要优化这里
5 .感觉就是刚给svg赋值之后立马动画就会出现性能问题，如果初始就赋值了，然后使用属性操作，就不会有性能问题
6 .文字变化
7 .loading类似样式变化
8 .弹幕-水印
9 .特殊字符拼成的图案。https://www.jianshu.com/p/fca56d635091
10 .图片-字符串https://www.degraeve.com/img2txt-yay.php?url=https%3A%2F%2Fwww.degraeve.com%2Fimages%2Flcsm.gif&mode=A&size=100&charstr=ABCDEFGHIJKLMNOPQRSTUVWXYZ&order=O&invert=N
11 .流程图转化为字符-http://asciiflow.com/
12 .生成字符字
13 .canvas处理图片 https://github.com/nhn/tui.image-editor-这样可以在canvas上画出任何想要的弹幕，然后转成字符显示
14 .canvas画图工具 https://github.com/1j01/jspaint
15 .为什么直接弹幕出现图片感觉没有出现更加简陋的字符画有感觉，虽然更土。。
16 .本来出现图片应该是活动或者官方做的礼物那种特效，但是这样用简陋的模拟有一种反叛的体验，相当于自嗨，也是很好的。
17 .All files must be modules when the '--isolatedModules' flag is provided.不允许有空的文件，ts里面

准备的弹幕类型

单个元素

1 .鼠标画一条线条，弹幕沿着线条前进，前进的时候进行各种属性的变化
2 .里面的弹幕内容，支持图片生成字符串，支持自定义流程图转为字符串做各种各样私人定制的从左
3 .弹幕的内容支持svg动画，比如一个汉字，线条生成一个汉字，其他图案
4 .https://github.com/chanind/hanzi-writer 可以用这种实现，但是不够浮夸
5 .https://juejin.im/post/6844904201454092296 以这个实现为准
6 .输入汉字，直接执行描边操作,在这个基础上进行动画选择操作，添加帧动画

多个元素

1 .

玩家写弹幕的操作逻辑

1 .选择路径，普通从左到右，还是自定义路径
2 .选择弹幕个数，是一次输入多条，然后做动画，还是只有一句话做动画- 多条的时候要分是否输入汉字，还是仅仅需要多个div进行变换
3 .输入弹幕-直接写汉字，还是支持传入图片生成字符串。
4 .添加帧，设置每一帧需要的变化情况
5 .预览动画
6 .发送弹幕

问题1，文字无法用animejs 简单实现描边

1 .getTotalLength() 只支持path元素
2 .这种复杂的确是使用css实现比较简单，但是如果是玩家自定义的话，肯定不能这样搞
3 .只能手动？？？文字元素不能获得长度

问题

// const handleRemove=useCallback((index)=>{
    //     console.log(`删除${index}这个元素`)
    //     let arr=state.slice()
    //     console.log(arr)
    //     console.log(index)
    //     for(let i=0;i<arr.length;i++){
    //         if(index===arr[i].index){
    //             arr.splice(i,1)
    //         }
    //         break;
    //     }
    //     setState(arr)
    //     // 这样写会造成死锁
    // },[state,setState])
//为什么总的state增加，这个依赖的handleRemove不会更新到最新的值,还是旧的，导致需要使用ref解决

1 .每一个子项都需要删除方法，但是删除方法传入的state拿不到最新的state数据
2 .目前是一个不停循环的操作
3 .