Wie man auf ein Zellobjekt klickt?

Question

Ich benutze Javascript, p5.js und Daniel Shiffmans tutorial, um eine visuelle Darstellung eines A * Suchalgorithmus zu erstellen.

Ein Bild von einem Beispiel Gitter sieht wie folgt aus: example grid

Ist es möglich, auf jede Zelle des Gitters klicken, um es Attribute auszudrucken? Basierend auf Daniel Shiffmans anderen Tutorial auf how to click on objects, verstehe ich, dass ich 2 Funktionen erstellen muss, die jeweils aktivieren und ausführen. Ich verstehe, wie man das mit einem Kreis macht, weil ein Kreis einen Radius hat.

Aber ich verstehe nicht, wie man das mit einer Zelle macht, weil ich nur ihre Koordinaten habe. Ich kann nicht sehen, wie man Koordinaten als Maß verwendet, um Länge zu berechnen.

Ich würde jede Anleitung zu meinem Denken schätzen. Vielen Dank im Voraus.

Answer 1

Ich schrieb ein Tutorial zur Kollisionserkennung verfügbar here. Das ist für die normale Verarbeitung, aber in P5.js ist alles gleich. Sie suchen nach einer Kollision mit einem Rechteckpunkt.

Grundsätzlich müssen Sie überprüfen, ob der Punkt zwischen den linken und rechten Kanten des Rechtecks ​​und zwischen den oberen und unteren Kanten des Rechtecks ​​liegt. Wenn beide wahr sind, befindet sich der Punkt innerhalb des Rechtecks.

Ich empfehle breaking your problem down into smaller steps und diese Schritte nacheinander durchzuführen. Versuchen Sie beispielsweise, es mit einem einzelnen hartcodierten Rechteck und Punkt zu arbeiten, bevor Sie es mit mehreren Zellen oder mit Benutzereingaben versuchen.