私は<circle>それぞれ独自の内部にいくつかの要素を持ってい<g>ます。円を動かすために、それぞれに「変換」変換を適用しています<g>。
私が気付いたのは、円が動いているときに、それらの一部がわずかに切り捨てられているように見えることです. 休むとすぐに元気に見えるので、動いている間だけです。切り捨て効果は、円と同じサイズの正方形のビューポートがあり、円を中心から少しずらした場合に見えるものと似ています。片側だけ少し平らになります。
これは、私の要素グループの1つがどのように見えるかです:
<g class="datapoint dot" transform="translate(360,56)">
<circle class="rendering" style="fill: #3182bd; stroke: #225b84; stroke-opacity: 1; fill-opacity: 1; " r="7"></circle>
</g>
デバッガーを監視しながらトランジションを実行すると、「変換」の値が変更されていることがわかりますが、それ以外はすべて同じままです。だから、私が間違っているとは思えませんが、あなたはそれを確信することはできません. :)
最後のコメントは、これは複数のブラウザーで見られるということです (これまでに Chrome と Firefox を試しました)。
誰もこのようなことに遭遇したことがありますか？