Tôi đang sử dụng javascript và canvas để vẽ thang được thiết kế toán học (để đo mô-men xoắn, nó bao gồm newton-mét và foot-pounds). Tôi đã định vị ve của mình bằng cách sử dụng lượng giác, và vẽ các đường phun bằng cách sử dụng arc, một cách tự nhiên. Vấn đề xảy ra khi họ cần phải xếp hàng, nhưng có một số biến dạng kỳ lạ. Sau đó tôi vẽ một vòng tròn rất lớn và so sánh nó với một lựa chọn hình tròn trong GIMP và có một sự biến dạng. Các vòng tròn nhất quán mỗi 45 độ xung quanh các vòng tròn, nhưng giữa các nút đó vòng tròn vẽ vải lệch ra ngoài, giống như một hình bát giác có thể được làm tròn quá xa để gần đúng một vòng tròn.Làm cách nào để vẽ hình tròn trên canvas?
Tại sao những biến dạng này xảy ra? Làm thế nào tôi có thể vẽ một vòng tròn thực sự tròn trên vải?
Đây là mã tôi đã sử dụng để tạo vòng tròn méo mó của mình.
<!DOCTYPE html>
<html>
<body>
<canvas width=8000 height=8000 id='myCanvas'></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.beginPath();
context.arc(4000, 4000, 3200, 0, Math.PI*2, false);
context.lineWidth = 1;
context.strokeStyle = '#ff0000';
context.lineCap = 'square';
context.stroke();
</script>
</body>
</html>
này có thể không được tối thiểu, tôi biết không sự liên quan của context.lineCap, nhưng đó là một di tích của mã này được dựa trên. Ảnh chụp màn hình dưới đây cho thấy sự khác biệt giữa các vòng tròn được vẽ bởi GIMP và vòng tròn được vẽ bởi Chrome 
bạn có mã mẫu nào không? –
@JonSaw Chắc chắn rồi. Tôi sẽ thêm vào mã tôi đã sử dụng để tạo vòng kết nối của mình. –
Chạy mã của bạn trên Safari (8.0.6), Chrome (43.0.2357.132) & Firefox (36.0.4) - nó trông rất đẹp. JS Bin [ở đây] (https://jsbin.com/pogehixibu/edit?html,output). Chỉ vì tò mò, bạn đang sử dụng trình duyệt nào? –