javascript - Hur ändrar jag mitt rutnät så att det räknar från vänster till höger, uppifrån och ner?

Jag försöker skapa ett kvadratiskt rutnät av kartkoordinater med ett gridOrder-antal som börjar räkna i det övre vänstra hörnet, från vänster till höger, uppifrån och ner.

När koordinaterna visas på en karta bör räkningen gridOrder se ut så här (önskad korrekt version):

 1 | 2 | 3
---+---+---
 4 | 5 | 6
---+---+---
 7 | 8 | 9

Men för närvarande ser det ut så här (nuvarande felaktiga version):

 3 | 6 | 9
---+---+---
 2 | 5 | 8
---+---+---
 1 | 4 | 7

Hur kan jag justera koden nedan för att tilldela ett gridOrder-antal i mitt önskade mönster från vänster till höger, uppifrån och ner?

Jag vet att problemet är hur jag tilldelar gridOrder under map(). Men jag har försökt många olika variationer och jag kan inte få det att fungera.

import bbox from "@turf/bbox";
import { Units, point } from "@turf/helpers";
import pointGrid from "@turf/point-grid";
import buffer from "@turf/buffer";

const createGridCoordinates = (
  centerCoordinates: google.maps.LatLngLiteral,
  numPointsPerSide: number,
  gridDimension: number,
  unitOfMeasure: Units
) => {
  // Calculate the cell size
  const cellSize = gridDimension / (numPointsPerSide - 1);

  // Calculate half the grid size to find the distance from center to edges of bounding box
  const halfGridSize = gridDimension / 2;

  // Make the bounding box around a center point and a circle buffer radius
  // Radius is extended by 10% of a cellSize (cellSize / 10) to include
  // east and north edges when gridDimension is an exact multiple of the grid spacing
  const boundingBox = bbox(
    buffer(
      point([centerCoordinates.lng, centerCoordinates.lat]),
      halfGridSize + cellSize / 10,
      {
        units: unitOfMeasure,
      }
    )
  );

  // Make the grid. This is an array of grid coordinates.
  const grid = pointGrid(boundingBox, cellSize, {
    units: unitOfMeasure,
  });

  // Extract the coordinates from the grid and add gridOrder
  const coordinatesGrid = grid.features.map((feature, index) => {
    const [longitude, latitude] = feature.geometry.coordinates;
    const coordinatesGridItem = {
      coordinates: { lat: latitude, lng: longitude },
      gridOrder: index + 1,
    };
    return coordinatesGridItem;
  });

  return coordinatesGrid;
};

Svar #1

Jag listade ut det.

Istället för att försöka ändra värdet på gridOrder på konstiga sätt, sorterade jag bara rutnätskoordinaterna innan jag tilldelade gridOrder.

Här är den fullständiga fungerande koden:

const createGridCoordinates = (
  centerCoordinates: google.maps.LatLngLiteral,
  numPointsPerSide: number,
  gridDimension: number,
  unitOfMeasure: Units
) => {
  // Calculate the cell size
  const cellSize = gridDimension / (numPointsPerSide - 1);

  // Calculate half the grid size to find the distance from center to edges of bounding box
  const halfGridSize = gridDimension / 2;

  // Make the bounding box around a center point and a circle buffer radius
  // Radius is extended by 10% of a cellSize (cellSize / 10) to include
  // east and north edges when gridDimension is an exact multiple of the grid spacing
  const boundingBox = bbox(
    buffer(
      point([centerCoordinates.lng, centerCoordinates.lat]),
      halfGridSize + cellSize / 10,
      {
        units: unitOfMeasure,
      }
    )
  );

  // Make the grid
  const grid = pointGrid(boundingBox, cellSize, {
    units: unitOfMeasure,
  });

  // Make a normal array of the grid coordinates
  const coordinates = grid.features.map((feature) => {
    const [longitude, latitude] = feature.geometry.coordinates;
    const coordinatesGridItem = {
      coordinates: { lat: latitude, lng: longitude },
    };
    return coordinatesGridItem;
  });

  // Sort by latitude (y) in descending order, then by longitude (x) in ascending order
  coordinates.sort((a, b) => {
    const coord1 = a.coordinates;
    const coord2 = b.coordinates;

    if (coord1.lat > coord2.lat) {
      return -1;
    }
    if (coord1.lat < coord2.lat) {
      return 1;
    }
    if (coord1.lng < coord2.lng) {
      return -1;
    }
    if (coord1.lng > coord2.lng) {
      return 1;
    }
    return 0;
  });

  // Add gridOrder to the new array
  const coordinatesGrid = coordinates.map((coordinate, index) => {
    const coordinatesGridItem = {
      ...coordinate,
      gridOrder: index + 1,
    };
    return coordinatesGridItem;
  });

  return coordinatesGrid;
};