草庐IT

贝塞尔

全部标签

javascript - 如何检测由贝塞尔曲线制成的物体与圆之间的碰撞?

所以我写了一个微生物动画。这一切都很酷,但我认为,如果微生物能够吃掉硅藻并破坏气泡,那就更好了。问题在于微生物是由贝塞尔曲线构成的。我不知道如何以合理的方式检查由贝塞尔曲线构成的对象与圆之间的碰撞。我唯一想到的是在隐藏的Canvas上绘制微生物形状和气泡,然后检查它们是否绘制到相同的像素。但这会导致严重的性能问题恕我直言。代码:https://codepen.io/michaelKurowski/pen/opWeKYclassCell是单元格,而classCellWallNode是贝塞尔曲线的节点,以防有人需要查看实现。气泡和硅藻可以很容易地简化为圆形。 最

javascript - 将贝塞尔曲线分成相等的两半

我有两点之间的贝塞尔曲线。我想将所有曲线切成相等的两半。我的一个想法是,如果我可以控制“t”值,我将通过t=[0,0.5]和t=[0.5,1]绘制2条曲线,但我不知道如何。下面是我的代码。我不会介意任何其他想法或建议D3testvarOver=function(){d3.select(this).style("stroke-opacity",0.25);}varOut=function(){d3.select(this).transition().duration(200).style("stroke-opacity",0);}functioncurve(n,x1,y1,x2,y2){

javascript - 如何找到贝塞尔曲线的中点?

我想制作一条“命名”贝塞尔曲线。我希望它是一个单词命名的,这样我就不必担心自动换行。我通过P5bezier(sx,sy,c1x,c1y,c2x,c2y,ex,ey)函数制作贝塞尔曲线,我希望在贝塞尔曲线的中间显示一个字符串。但我不知道如何找到曲线的“中间”。现在我的结果是这样的(我不知道从哪里开始解决这个问题,所以我采用了更简单的方法,即在曲线的起点打印文本):但我希望它看起来像这样:这意味着我需要P1和P2坐标:抱歉绘画,但我还没有我的代码。一拿到手,我就会把它添加到这里。下面是绘制曲线的代码:letb=dest.inTriangle.middle,//destinationtria

javascript - 如何编写 n 阶贝塞尔曲线

尝试在Canvas上的javascript中为项目编写n阶贝塞尔曲线。我希望能够让用户按下一个按钮,在本例中为“b”,以选择每个端点和控制点。到目前为止,我能够在按键上获取鼠标坐标,并使用内置函数制作二次曲线和贝塞尔曲线。我将如何为第n个订单编写代码? 最佳答案 这是n阶贝塞尔曲线的Javascript实现://setupcanvasvarcanvas=document.getElementById('canvas');varctx=canvas.getContext('2d');canvas.height=window.inner

javascript - Html5 Canvas Bezier 上的虚线曲线

对于我的一个应用程序,我需要在Html5Canvas中的贝塞尔曲线路径上绘制虚线曲线...破折号的长度和中间的间隙应该是可变的...它可以在JavaFx中实现,seethislink...我想使用Html5Canvas实现相同的效果。我知道如何绘制直线虚线,但不知道如何沿着贝塞尔曲线绘制曲线...虽然我不是专家,但我知道bezierdrawingalgorithm,我看到这个算法的问题是,它允许您使用范围从0到1的时间参数来识别贝塞尔曲线上的坐标...这还不够,因为要绘制虚线贝塞尔曲线,我需要在主要贝塞尔曲线路径上绘制许多具有指定长度参数和给定间隙距离的小贝塞尔曲线。JavaFx必须使

javascript - 如何计算避开物体的贝塞尔曲线控制点?

具体来说,我正在使用javascript在Canvas上工作。基本上,我的对象有我想避免的边界,但仍然用贝塞尔曲线环绕。但是,我什至不确定从哪里开始编写一个可以移动控制点以避免碰撞的算法。问题在下图中,即使你不熟悉乐谱,问题应该还是很清楚的。曲线的点是红点此外,我可以访问每个音符的边界框,其中包括词干。所以自然地,必须在边界框和曲线之间检测到碰撞(这里有一些方向会很好,但我一直在浏览,发现有很多关于这方面的信息)。但是在检测到碰撞后会发生什么?计算控制点位置以使某些东西看起来更像: 最佳答案 贝塞尔方法最初,这个问题是一个广泛的问题

javascript - 给定 x 立方贝塞尔曲线的 y 坐标

这个问题非常类似于:Quadraticbeziercurve:YcoordinateforagivenX?.但是这个是立方体的...我正在使用getBezier函数计算贝塞尔曲线的Y坐标。贝塞尔曲线总是从(0,0)开始,总是在(1,1)结束。我知道X值,所以我尝试将其作为百分比插入(我是个白痴)。但这显然行不通。你能提供一个解决方案吗?这是必要的,它是一个白痴证明功能。喜欢:functionyFromX(c2x,c2y,c3x,c3y){//c1=(0,0)andc4=(1,1),domainc2anddomainc3=[0,1]//yourmagicreturny;}

c# - 将贝塞尔曲线段或线的端点绑定(bind)到 WPF 中的其他形状?

我正在尝试创建类似于UDK或MayaMaterial编辑器的东西http://www.google.com/search?q=udk+material+editor&oe=utf-8&rls=org.mozilla:en-US:official&client=firefox-a&um=1&ie=UTF-8&hl=en&tbm=isch&source=og&sa=N&tab=wi&biw=1144&bih=929通过单击一个连接并将其拖动到另一个连接,可以连接两个节点。WPF可以执行此操作,但我不知道如何以编程方式(使用C#,而不是XAML)绑定(bind)贝塞尔曲线的端点和控制点以跟随

c# - 在贝塞尔曲线的平行线中检测到 "Kinks"

我希望有人能帮我找出一种计算成本低廉的方法来检测与贝塞尔曲线平行绘制的直线中的扭结,如您在此处所见我想做的是能够确定拐点的交点,即起点在交点之前的线段和终点在拐点之后的第一个线段。这样我就可以简单地删除任何不必要的线段并调整第一个和最后一个线段以在交叉点相遇。如果我使用了不正确的术语,我们深表歉意。但据我所知,我定位这些线段的方式是确定贝塞尔曲线(黄色)线段的单位向量并将其乘以偏移量并找到法线向量以创建两个新的起点和终点用于偏移段(白色)。数学不是我的强项,所以我希望有人能在正确的方向上插入我。编辑:图像实际上已经通过HTML调整了大小,所以如果您很难理解我在说什么,请点击这里的直接链

c# - 双色路径对象

下图说明了我正在努力实现的目标:基本上我想创建两个Path相互“接触”的对象(平行路径)。这是用于生成此图像的XAML:M10,10C20,1010,2020,20M10,11C19,10.859,20.8020,21M10,10C20,1010,2020,20M10,11C19,119,2120,21第一条曲线具有手动优化的点位置,第二条曲线具有通过考虑笔划粗细轻松计算的点位置。你可以看到第二条曲线并不完美,因为两者之间有一个空间。如何以编程方式创建两条完美“接触”的曲线,而无需手动优化每条曲线(这实际上是不可能的,因为曲线是在代码中生成的)?简单地说,我在代码中生成一条曲线(res