Html 5 canvas hành vi tránh đắp khi chồng chéo
Như bạn có thể nhìn thấy trong hình trên, chúng tôi có những dòng rõ ràng giữa hình vuông isometric của tôi, điều này là do mỗi vuông sligthly chồng chéo lẫn nhau. Bây giờ chồng chéo là không thể tránh khỏi do hệ thống phối hợp tôi sử dụng để vẽ với (Và tôi không muốn thay đổi nó).
Đây là im mã sử dụng để vẽ các ô vuông
cRenderContext.beginPath();
cRenderContext.moveTo(iPosX, iPosY);
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY - iTileHeightIncrement);
cRenderContext.lineTo(iPosX + iTileWidth, iPosY);
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY + iTileHeightIncrement);
cRenderContext.lineTo(iPosX, iPosY);
cRenderContext.fillStyle = "rgba(1, 0, 1, 1)";
cRenderContext.fill();
cRenderContext.closePath();
Những gì tôi muốn đạt được là để vẽ các ô vuông với bất cứ phác thảo rõ ràng, vì vậy về cơ bản là có một cách để ngăn chặn điền làm những gì nó hiện đang chồng chéo?
CHỈNH SỬA: Tôi sẽ đề cập đến mỗi hình vuông được vẽ bằng một màu hơi khác vì vậy tôi không thể điền vào toàn bộ khu vực bằng một màu và được thực hiện (nó chỉ trông có màu đen nhưng mỗi màu khác 1 màu đỏ hoặc kênh xanh)
Nếu không có phác thảo thì đó chỉ là một tấm vải đen lớn, phải không? – James
có về cơ bản trong mã thực tế (và hình ảnh) màu của mỗi ô vuông hơi khác nhau, với giá trị rgb tăng thêm 1 trong một trong hai kênh màu đỏ hoặc xanh – Tristan
Bạn có thực sự có nghĩa là "chồng chéo" không? Các cạnh của mỗi hình vuông isometric không chạm vào, phải không? Bạn muốn thu hẹp khoảng cách giữa chúng? – James