Hello,
I'm working on a HTML5 canvas game, where some areas should be drawn connceted in some kind of "blob" of circles.
The code im using to draw looks like this, and an… (xem thêm)
Hello,
I'm working on a HTML5 canvas game, where some areas should be drawn connceted in some kind of "blob" of circles.
The code im using to draw looks like this, and an example can be found on github:
https://github.com/jrie/Connect
The error is visible when a fleet is navigated outside the main circle, to archive that:
Click on fleet icon, click on planet, pressing T to make a turn and see the fleet moves
At some point, some strange graphic error, looking like a triangle or extension occurs.
Please try different distances, destionations as possible, its always producing this strange effect.
The code in question producing the result is:
Line 2340 until 2348
gameScreen.beginPath();
for (area in env.scanAreas) {
scanArea = env.scanAreas[area];
scanX = scanArea[1] + env.offsetX;
scanY = scanArea[2] + env.offsetY;
gameScreen.arc(scanX, scanY, scanArea[0], 0, 6.28);
}
gameScreen.closePath();
gameScreen.fill();
If the beginPath and closePath and fill are all stuffed into the for loop, it draws well, but its a different effect and not one "blob" as requested in this case.