如何计算与CSS3创建的边界半径匹配的曲线上的点？几何天才？

Question

我有一个用css3边界半径创建的曲线div(图像部分).我旁边有文字行,我想在曲线上对齐20px左右,就像这样(无法发布图片,无法记住旧登录):

诀窍是曲线的变化取决于窗口大小,所以我希望能够计算出文本应该偏移的曲线上的点,从而创建一个真正的手动文本换行.

最终我需要能够使用javascript计算和更新.

(编辑以添加下面的评论):用于演示的曲线css是border-bottom-left-radius:316px 698px; 但这是根据脚本的页面大小计算的.另外,值得一提的是,我根本不需要支持IE或FireFox - 只需webkit(独立的kiosk应用程序).

Answer 1

正如 duri 评论中所建议的，您可以使用圆方程： http://www.wolframalpha.com/input/? i=%28x-5%29 ^2%2B%28y%2B4%29^2%3D25 （其中中心在 5；-4 r=5)

然而，我使用贝塞尔曲线在 Javascript 中绘图。它们非常灵活，由 2 个向量组成，它们形成的曲线从第一个向量的初始点开始，到第二个向量的初始点结束。更多：http://en.wikipedia.org/wiki/B%C3%A9zier_curve （请注意，绘制圆矢量的一部分将是垂直的）