如何在单个for循环中覆盖网格中的每个正方形？

Question

I am implementing dynamic map tiles and have come across a bit of a puzzling issue. Suppose I have a grid of 8x8 squares, like a chessboard. I need to place an image on each of these squares, preferably starting in the centre and working out from there.

Is this possible to accomplish in a single for loop, or will it take several loops? As I said, these images are squares, and are being placed on a map. They are all 0.025° in latitude/longitude.

Here's my initial thought:

for (var i=-0.25; i<=0.25; i+=0.025) {
    var adjustedLatitude = (requestedLatitude + i);
    var adjustedLongitude = (requestedLongitude + i);
}

Of course, this will only fill the grid in a diagonal pattern. What is the best way to do this?

Answer 1

Personally I think it's most readable to use a nested loop:

for (var i=-0.25; i<=0.25; i+=0.025) {
    for (var j=-0.25; j<=0.25; j+=0.025) {
        var adjustedLatitude = (requestedLatitude + i);
        var adjustedLongitude = (requestedLongitude + j);
        doStuffWithAxes(adjustedLatitude, adjustedLongitude);
    }
}

However, you could accomplish it using a single loop as so:

for (var i=0; i<=20*20; i++) {
    var xoffset = (i % 20 - 10) / 40;
    var yoffset = (i / 20 - 10) / 40;
    var adjustedLatitude = (requestedLatitude + xoffset);
    var adjustedLongitude = (requestedLongitude + yoffset);
    doStuffWithAxes(adjustedLatitude, adjustedLongitude);
}