可能更多的是一个数学问题，但这里是......
我想要做的是通过背景画布上的动画线连接两个 HTML 元素
这是我想做的事情的简化版本的小提琴。
http://jsfiddle.net/loupax/zUqXn/
这些线条实际上在那里，但它们在画布之外，如果您使用元素检查器，您可以看到画布中绘制线条的坐标。
有人可以帮助我解决我做错了什么并且线条画错位吗？
这证明了线条是画出来的，但位置不合适。 （用固定尺寸替换流体阶段和画布尺寸）
http://jsfiddle.net/loupax/zUqXn/8/
编辑
看起来我想要做的事情对于流体布局来说是不可能的。经过很多麻烦，我发现 Canvas 元素是它自己的平面，并且没有安全的方法将锚点坐标与没有固定大小的画布坐标相匹配
我已经找到了线路错位的原因。
看起来canvas的CSS宽度和高度与canvas元素的实际宽度和高度完全不同。因此，如果您希望使 HTML 元素的坐标与 Canvas 元素上的线条坐标相匹配，则需要在包含它的 div 上设置固定宽度，并直接在元素上设置相同且固定的宽度和高度
这是固定的示例，您可以看一下：
http://jsfiddle.net/loupax/zUqXn/29/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
