jsとCSSを使って2点間に線を引く方法

Question

これは、jQuery を使用して追加された 2 つの点と、それらの点を結ぶ線で構成される単純な HTML ページです。

結果として、線には接続点はありませんが、何らかの理由で線がオフセットされます。

リーリー リーリー リーリー

ラインと 2 つの点には position:absolute; があるため、top と left はコンテナに対して相対的です。 p>

margin また、3 をすべてゼロに設定します

ラインの上部は point1 の上部に設定されていますが、ラインは point1 の上にあります。

＃＃＃何故ですか？

Answer 1

線は中心を中心に回転します。原点に基づいて回転させたいとします。この場合、原点は 左上隅ですが、他の点でも構いません。したがって、transform-origin: 左上

を追加する必要があります。

リーリー リーリー リーリー