贝塞尔曲线工具生成器

案例:
在此编辑器基础上,开发的一款游戏(这个年都没过,就开发了这款游戏了),欢迎论坛的兄弟们支持一波,凑够1000人开个广告赚点抽烟钱:

介绍:
通过多个一段段的贝塞尔曲线连接生成一个更加复杂的曲线轨道。

演示链接:
https://1ko1.com/games/bezier/index.html

用法:
蓝色圆球:当前贝塞尔的起点 (鼠标可拖拽);
绿色圆球:当前贝塞尔的控制点 (鼠标可拖拽);
红色圆球:当前贝塞尔的结束点 (鼠标可拖拽);
按钮Add: 生成下一段曲线;
按钮Del:删除最后一段曲线;
按钮导出:将所有路径数据导出;
按钮导入:从外部导入路径数据(可点击2次,一次打开,一次关闭);

效果图:



我是分割线


贝塞尔曲线技术思路分享:
https://forum.cocos.com/t/topic/73642

24赞

模拟数据:

{
“begin”:[
“-38.2265625,527.84375”,
“747.4609375,695.875”,
“1219.640625,498.7734375”,
“1213.3203125,330.6640625”,
“1053.3359375,418.375”,
“690.875,602.7578125”,
“160.8125,468.3046875”,
“128.4609375,141.8671875”,
“788.734375,73.03125”,
“1184.0625,206.8515625”,
“1022.5390625,284.3359375”,
“845.3515625,196.8125”,
“446.8203125,168.8203125”
],
“end”:[
“747.4609375,695.875”,
“1219.640625,498.7734375”,
“1213.3203125,330.6640625”,
“1053.3359375,418.375”,
“690.875,602.7578125”,
“160.8125,468.3046875”,
“128.4609375,141.8671875”,
“788.734375,73.03125”,
“1184.0625,206.8515625”,
“1022.5390625,284.3359375”,
“845.3515625,196.8125”,
“446.8203125,168.8203125”,
“267.421875,359.6171875”
],
“control”:[
“249.046875,679.5”,
“1094.4921875,670.9296875”,
“1307.5625,384.6171875”,
“1119.0390625,288.703125”,
“936.703125,619.7890625”,
“329.7421875,574.234375”,
“-24.7890625,341.765625”,
“241.1484375,37.265625”,
“1131.7265625,117.4140625”,
“1183.3203125,282.2109375”,
“942.6640625,256.640625”,
“657.984375,112.6015625”,
“224.03125,210.09375”
]
}



导入数据用法:
将以上测试数据复制后,点击"按钮导入",粘贴以上数据,再次点击"按钮导入",关闭输入框,立即生成曲线。

1赞

绘制路径用法:

依次移动3个圆球,绘制曲线,完毕后,再次点击"按钮Add",生成下一个曲线,鼠标继续移动圆球,依次重复,最后导出数据。

给力!!!!!!!!!!!

可以做个插件

能保证连接处的切线一致吗?

1赞

强大。。。

add产生的新钢笔线,太靠上时绿点会在屏幕外点击不了。

1赞

真是厉害了,赞一个

6666666Mark

666666 标记一下

mark666666

6 mark 一下

有用的工具~

mark

好厉害的工具。mark

楼主大大这个工具可以开源吗?

好东西,支持一波

mark

建议不要填充满屏,拖动的点超出屏幕就拖动不了