Mandelbrot mit JSXGraph

Aus Wiki1

(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
Zeile 127: Zeile 127:
   });
   });
-
  // Zoom mit Mausrad
+
-
  canvas.addEventListener('wheel', e => {
+
-
    e.preventDefault();
+
-
    const zoomFactor = 1.2;
+
-
    const rect = canvas.getBoundingClientRect();
+
-
 
+
-
    // Mausposition relativ zum Canvas
+
-
    const px = e.clientX - rect.left;
+
-
    const py = e.clientY - rect.top;
+
-
 
+
-
    // Koordinaten in komplexer Ebene
+
-
    const spanX = baseWidth / zoom;
+
-
    const spanY = baseHeight / zoom;
+
-
    const xMin = centerX - spanX/2;
+
-
    const yMin = centerY - spanY/2;
+
-
    const cx = xMin + (px / canvas.width) * spanX;
+
-
    const cy = yMin + (py / canvas.height) * spanY;
+
-
 
+
-
    if (e.deltaY < 0) {
+
-
      // reinzoomen
+
-
      zoom *= zoomFactor;
+
-
    } else {
+
-
      // rauszoomen
+
-
      zoom /= zoomFactor;
+
-
    }
+
-
 
+
-
    // Mittelpunkt auf Mauszeiger ausrichten
+
-
    const newSpanX = baseWidth / zoom;
+
-
    const newSpanY = baseHeight / zoom;
+
-
    centerX = cx - (px / canvas.width) * newSpanX;
+
-
    centerY = cy - (py / canvas.height) * newSpanY;
+
-
 
+
-
    update();
+
-
  });
+
   // Initial zeichnen
   // Initial zeichnen

Version vom 11:11, 15. Sep. 2025

Mit den Schiebereglern können Iterations-Tiefe und Zoom gesteuert werden. Mit der Maus+linke Maustaste kann der Bildausschnitt verschoben werden.

Ein Hinweis:

Dieses Script wurde mit Hilfe mehrerer Prompts durch ChatGPT erstellt. Allerdings musste ich es an einzelnen Stellen anpassen, da es sonst nicht funktioniert hätte. Man kann also durch ChatGPT erstellen - benötigt aber zumindest Grundkenntnisse der jeweiligen Script- oder Programmiersprache. Im vorliegenden Fall wurde z.B. das Canvas-Bild so angeordnet, dass die Slider verdeckt waren. Die Position des Bildes musste leicht angepasst werden.


Hier die Prompts:

  1. gib mir jetzt einen jsxgraph-code für die erstellung einer Mandelbrot-Grafik mit regler zur Steuerung der Tiefe
  2. schlag mir eine schnellere variante vor (ChatGPT schlug eine Lösung mit canvas-Element vor)
  3. bitte ändere das script so, dass ich mit einem regler in die graphik zoomen kann
  4. mit der Maus soll der angezeigte Bereich des Bildes verschoben werden können
Von „https://www.technikundkultur.de/wiki1/index.php5?title=Mandelbrot_mit_JSXGraph“
Persönliche Werkzeuge