Laya绘制曲线

1 laya提供的api 绘制：

很简单一段代码，但是问题来了，这是曲线，曲线。印象中opengl 是没有提供绘制曲线的api的，只有直线。

今天有人问我一个问题，unity中对曲线可视化是怎么做的，如下图这种。

然后我这个小菜鸡有愣住了。读书时，上opengl的时候划水去了啊，我只隐约记得直线调用api就好，曲线呢？那是怎么来的？

我开始大胆猜想：咱们做游戏，做抛物运动怎么做的（不借用物理引擎，那个比较重，对于h5游戏来说大材小用），一般是设立抛物方程，利用游戏循环渲染，去更新物体位置。需求不同的时候还会提前计算出下一帧到哪里。其实废话这么多，很多人都想骂，这特么不就是函数采样？

现在得到点的位置了，那线呢？你给点进去计算机又不会把它们连成线。嗯，给点进去，计算机还真的会给你连成线，就看你怎么给这个点。

按照opengl认识的方式给点咯。就是opengl渲染网格。但是这有点垃圾吧，一条线需要这么多点，ui都才需要四个点。按照渲染网格方式绘制线，那得多少个点啊。想到这里，我就不会了，引擎大大们也是用这么low的方式？

开源引擎laya，开源永远的神。我找到了laya绘制曲线，laya说没错就是你想的这样，只不过我比你牛，我可以做合批，我只采样30个点，就解决你的渲染问题了，看了laya引擎绘制曲线，小垃圾我真的很垃圾。

废话这么多贴一下Laya 的源码，我懒得写了，原谅一下哈。

第一步利用贝塞尔曲线进行采样

第二步利用采样出的点，进行绘制线段（渲染就不贴了，有空再贴一下渲染）

大体思路就是：现在有线段两端的点，还需要找出平行线段的点。那就先计算斜率，对线段平移，带上宽度。一段线段绘制完毕，接着一段。下面直接上图

取前四个点绘制就是这样。

完整的绘制

是不是感觉采样很垃圾，都能看到锯齿。

不知道贪吃蛇游戏那种是不是这么做的，感觉他们没有锯齿啊！

要去掉锯齿我只能提高采样点了，然后绘制网格的时候一段线段多给点网格，或者试试双重采样，线性？没试过，猜想哈

知道的call下小弟我。

拓展一下，特效拖尾，也差不多这思路一样是对网格加骚操作，不过要复杂一些，没有采样的概念，会加上拖尾力的概念。

顺带一提laya这绘制线段的性能，真不咋高。这都是小问题，开源就是大佬。