ESP32 Börsen-Ticker mit 2,4" TFT-Display

{
  "meta": {
    "symbol": "AAPL",
    "interval": "15min"
  },
  "values": [
    {
      "datetime": "2026-07-24 09:30:00",
      "open": "212.41",
      "high": "213.02",
      "low": "212.20",
      "close": "212.88",
      "volume": "1840233"
    }
  ],
  "status": "ok"
}

#include <SPI.h>
#include <Adafruit_GFX.h>
#include <Adafruit_ILI9341.h>

#define TFT_CS 15
#define TFT_DC 2
#define TFT_RST 4

Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, TFT_RST);

void setup() {
  tft.begin();
  tft.setRotation(3); // Querformat 320 x 240; bei 1 steht das Bild kopf
  tft.fillScreen(ILI9341_BLACK);
  tft.setTextColor(ILI9341_GREEN);
  tft.setTextSize(3);
  tft.setCursor(20, 100);
  tft.print("Display laeuft!");
}

void loop() {}

/* ============================================================
ESP32 Börsen-Ticker mit Kursverlauf
Display : 2,4" TFT ILI9341 (Adafruit_GFX / Adafruit_ILI9341)
Kurse   : finnhub.io – Live-Kurs, 60 Anfragen/Minute
Verlauf : twelvedata.com – Intraday-Kerzen für die Grafik
Anleitung: Roboter-Bausatz.de
============================================================ */

#include <SPI.h>
#include <Adafruit_GFX.h>
#include <Adafruit_ILI9341.h>
#include <WiFi.h>
#include <WiFiClientSecure.h>
#include <HTTPClient.h>
#include <ArduinoJson.h>
#include <time.h>
#include <Fonts/FreeSans9pt7b.h>
#include <Fonts/FreeSans12pt7b.h>
#include <Fonts/FreeSansBold24pt7b.h>

// ---------- Display-Pins ----------
#define TFT_CS 15
#define TFT_DC 2
#define TFT_RST 4

// MOSI 23, SCK 18, MISO 19 = Hardware-SPI, wird automatisch genutzt
Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, TFT_RST);

// ============ HIER ANPASSEN =================================
const char* WIFI_SSID   = "MEIN_WLAN";
const char* WIFI_PASS   = "MEIN_PASSWORT";
const char* FINNHUB_KEY = "MEIN_FINNHUB_KEY";
const char* TWELVE_KEY  = "MEIN_TWELVEDATA_KEY";

struct Symbol { const char* ticker; const char* name; };

// Deine Watchlist – Zeilen ergänzen oder löschen, der Rest passt sich an
const Symbol watchlist[] = {
  { "AAPL", "Apple" },
  { "MSFT", "Microsoft" },
  { "NVDA", "NVIDIA" },
  { "AMZN", "Amazon" },
  { "TSLA", "Tesla" }
};

// ============================================================
const uint8_t ANZAHL = sizeof(watchlist) / sizeof(watchlist[0]);

// Zeitzone Deutschland inkl. automatischer Sommerzeit
const char* TZ_INFO = "CET-1CEST,M3.5.0/02,M10.5.0/03";
const char* NTP_SERVER = "pool.ntp.org";

const uint32_t KURS_INTERVALL    = 60000;  // 1 min – Live-Kurse (Finnhub)
const uint32_t CHART_INTERVALL   = 240000; // 4 min – ein Chart (Twelve Data)
const uint32_t WECHSEL_INTERVALL = 8000;   // 8 s – nächster Wert der Liste

#define MAX_PUNKTE 26 // Datenpunkte im Chart (26 x 15 min = 1 Handelstag)

// Laufzeitdaten, werden vom Programm gefüllt
struct Daten {
  float kurs;
  float diff;
  float proz;
  bool gueltig;
  float verlauf[MAX_PUNKTE];
  uint8_t punkte;
};

Daten daten[ANZAHL]; // global -> startet automatisch mit Nullen

// ---------- Farben (RGB565) ----------
#define FARBE_BG       0x0862 // fast schwarz
#define FARBE_BAR      0x1105 // Kopfzeile
#define FARBE_TEXT     0xFFFF // weiß
#define FARBE_GRAU     0x7C52 // Sekundärtext
#define FARBE_LINIE    0x39C7 // Hilfslinie im Chart
#define FARBE_GRUEN    0x2610 // im Plus
#define FARBE_ROT      0xE267 // im Minus
#define FARBE_GRUEN_BG 0x09C5 // Füllfläche unter der Kurve
#define FARBE_ROT_BG   0x38A2

// ---------- Layout ----------
#define BREITE  320
#define HOEHE   240
#define KOPF_H  28
#define CHART_X 12
#define CHART_Y 152
#define CHART_W 296
#define CHART_H 60

uint32_t tKurse = 0;
uint32_t tChart = 0;
uint32_t tWechsel = 0;
uint8_t anzeigeIndex = 0; // aktuell angezeigter Wert
uint8_t chartIndex = 0;   // als nächstes zu aktualisierender Chart
int letzteSekunde = -1;

// ===========================================================
void setup() {
  Serial.begin(115200);
  delay(200);

  tft.begin();
  tft.setSPISpeed(40000000); // 40 MHz; bei Bildstörungen auf 24000000 senken
  tft.setRotation(3);        // Querformat 320 x 240 (1 = um 180 Grad gedreht)

  statusText("Verbinde mit WLAN ...");
  wifiVerbinden();

  configTzTime(TZ_INFO, NTP_SERVER);

  statusText("Hole Kurse ...");
  kurseAktualisieren();

  statusText("Lade Charts ...");
  for (uint8_t i = 0; i < ANZAHL; i++) {
    chartAktualisieren(i);
    delay(1000); // Twelve Data erlaubt 8 Anfragen pro Minute
  }

  tft.fillScreen(FARBE_BG);
  kopfzeileZeichnen();
  wertZeichnen(anzeigeIndex);

  tKurse = tChart = tWechsel = millis();
}

// ===========================================================
void loop() {
  uint32_t jetzt = millis();

  // Live-Kurse aller Symbole
  if (jetzt - tKurse >= KURS_INTERVALL) {
    tKurse = jetzt;
    kurseAktualisieren();
    wertZeichnen(anzeigeIndex);
  }

  // Reihum einen Chart nachladen
  if (jetzt - tChart >= CHART_INTERVALL) {
    tChart = jetzt;
    chartAktualisieren(chartIndex);
    if (chartIndex == anzeigeIndex) wertZeichnen(anzeigeIndex);
    chartIndex = (chartIndex + 1) % ANZAHL;
  }

  // Zum nächsten Wert blättern
  if (jetzt - tWechsel >= WECHSEL_INTERVALL) {
    tWechsel = jetzt;
    anzeigeIndex = (anzeigeIndex + 1) % ANZAHL;
    wertZeichnen(anzeigeIndex);
  }

  uhrzeitZeichnen();
  delay(50);
}

// ===========================================================
// WLAN
// ===========================================================
void wifiVerbinden() {
  WiFi.mode(WIFI_STA);
  WiFi.begin(WIFI_SSID, WIFI_PASS);
  uint8_t versuche = 0;
  while (WiFi.status() != WL_CONNECTED && versuche < 40) {
    delay(500);
    Serial.print(".");
    versuche++;
  }
  Serial.println();
  if (WiFi.status() == WL_CONNECTED) {
    Serial.print("Verbunden. IP: ");
    Serial.println(WiFi.localIP());
  } else {
    Serial.println("WLAN-Verbindung fehlgeschlagen.");
    statusText("Kein WLAN!");
  }
}

// ===========================================================
// Live-Kurse von Finnhub
// ===========================================================
void kurseAktualisieren() {
  if (WiFi.status() != WL_CONNECTED) {
    wifiVerbinden();
    if (WiFi.status() != WL_CONNECTED) return;
  }

  for (uint8_t i = 0; i < ANZAHL; i++) {
    String url = String("https://finnhub.io/api/v1/quote?symbol=") 
               + watchlist[i].ticker + "&token=" + FINNHUB_KEY;

    WiFiClientSecure client;
    client.setInsecure(); // ohne Zertifikatsprüfung – hier ausreichend

    HTTPClient https;
    https.setTimeout(8000);

    if (https.begin(client, url)) {
      int code = https.GET();
      if (code == HTTP_CODE_OK) {
        JsonDocument doc;
        DeserializationError fehler = deserializeJson(doc, https.getString());
        if (!fehler) {
          daten[i].kurs   = doc["c"] | 0.0f;
          daten[i].diff   = doc["d"] | 0.0f;
          daten[i].proz   = doc["dp"] | 0.0f;
          daten[i].gueltig = (daten[i].kurs > 0);
          Serial.printf("%-6s %8.2f (%+.2f%%)\n", watchlist[i].ticker, daten[i].kurs, daten[i].proz);
        } else {
          Serial.printf("JSON-Fehler bei %s: %s\n", watchlist[i].ticker, fehler.c_str());
        }
      } else {
        Serial.printf("Finnhub HTTP %d bei %s\n", code, watchlist[i].ticker);
      }
      https.end();
    }
    delay(250);
  }
}

// ===========================================================
// Kursverlauf von Twelve Data
// ===========================================================
void chartAktualisieren(uint8_t i) {
  if (WiFi.status() != WL_CONNECTED) return;

  String url = String("https://api.twelvedata.com/time_series?symbol=") 
             + watchlist[i].ticker 
             + "&interval=15min&outputsize=" + String(MAX_PUNKTE) 
             + "&order=ASC&apikey=" + TWELVE_KEY;

  WiFiClientSecure client;
  client.setInsecure();

  HTTPClient https;
  https.setTimeout(10000);

  if (!https.begin(client, url)) {
    Serial.println("TwelveData: Verbindung fehlgeschlagen");
    return;
  }

  int code = https.GET();
  if (code != HTTP_CODE_OK) {
    Serial.printf("TwelveData HTTP %d bei %s\n", code, watchlist[i].ticker);
    https.end();
    return;
  }

  // Komplett einlesen statt direkt aus dem Stream zu parsen: Twelve Data
  // antwortet je nach Größe mit "chunked transfer encoding", woran ein
  // direkt lesender Parser scheitern würde.
  String antwort = https.getString();
  https.end();

  // Filter: nur "close" je Eintrag sowie Status und Fehlermeldung behalten
  JsonDocument filter;
  filter["values"][0]["close"] = true;
  filter["status"] = true;
  filter["message"] = true;

  JsonDocument doc;
  DeserializationError fehler = deserializeJson(doc, antwort, DeserializationOption::Filter(filter));

  if (fehler) {
    Serial.printf("Chart-JSON-Fehler bei %s: %s\n", watchlist[i].ticker, fehler.c_str());
    return;
  }

  // Wichtig: Twelve Data meldet Fehler oft mit HTTP 200 im JSON-Body
  const char* status = doc["status"] | "";
  if (strcmp(status, "ok") != 0) {
    Serial.printf("TwelveData meldet Fehler bei %s: %s\n", watchlist[i].ticker, doc["message"] | "unbekannt");
    return;
  }

  uint8_t k = 0;
  for (JsonObject eintrag : doc["values"].as<JsonArray>()) {
    if (k >= MAX_PUNKTE) break;
    daten[i].verlauf[k++] = eintrag["close"].as<float>();
  }
  daten[i].punkte = k;

  Serial.printf("Chart %s: %d Punkte\n", watchlist[i].ticker, k);
}

// ===========================================================
// Anzeige
// ===========================================================
void kopfzeileZeichnen() {
  tft.fillRect(0, 0, BREITE, KOPF_H, FARBE_BAR);
  textAn(12, 19, "MARKT-TICKER", &FreeSans9pt7b, FARBE_TEXT);
}

void wertZeichnen(uint8_t i) {
  char puffer[32];
  tft.fillRect(0, KOPF_H, BREITE, HOEHE - KOPF_H, FARBE_BG);

  // Firmenname und Börsenkürzel
  textAn(12, 52, watchlist[i].name, &FreeSans12pt7b, FARBE_TEXT);
  textAn(12, 74, watchlist[i].ticker, &FreeSans9pt7b, FARBE_GRAU);

  if (!daten[i].gueltig) {
    textAn(12, 118, "keine Daten", &FreeSans12pt7b, FARBE_GRAU);
    punkteZeichnen(i);
    return;
  }

  uint16_t farbe = (daten[i].diff >= 0) ? FARBE_GRUEN : FARBE_ROT;

  // Kurs, groß
  snprintf(puffer, sizeof(puffer), "%.2f", daten[i].kurs);
  textAn(12, 122, puffer, &FreeSansBold24pt7b, FARBE_TEXT);

  // Veränderung, farbig
  snprintf(puffer, sizeof(puffer), "%+.2f (%+.2f%%)", daten[i].diff, daten[i].proz);
  textAn(12, 146, puffer, &FreeSans12pt7b, farbe);

  // Dreieck als Richtungspfeil
  if (daten[i].diff >= 0) 
    tft.fillTriangle(292, 92, 278, 116, 306, 116, farbe);
  else 
    tft.fillTriangle(292, 116, 278, 92, 306, 92, farbe);

  chartZeichnen(i);
  punkteZeichnen(i);
}

// ---------- Der Kursverlauf ----------
void chartZeichnen(uint8_t i) {
  tft.fillRect(CHART_X, CHART_Y, CHART_W, CHART_H, FARBE_BG);

  uint8_t n = daten[i].punkte;
  if (n < 2) {
    textAn(CHART_X, CHART_Y + 34, "Verlauf nicht verfuegbar", &FreeSans9pt7b, FARBE_GRAU);
    return;
  }

  // Wertebereich bestimmen – der Vortagesschluss soll immer sichtbar sein,
  // damit die Nulllinie nicht aus dem Bild läuft
  float vortag = daten[i].kurs - daten[i].diff;
  float minWert = daten[i].verlauf[0];
  float maxWert = daten[i].verlauf[0];

  for (uint8_t k = 1; k < n; k++) {
    if (daten[i].verlauf[k] < minWert) minWert = daten[i].verlauf[k];
    if (daten[i].verlauf[k] > maxWert) maxWert = daten[i].verlauf[k];
  }

  if (vortag < minWert) minWert = vortag;
  if (vortag > maxWert) maxWert = vortag;

  float spanne = maxWert - minWert;
  if (spanne < 0.0001f) spanne = 1.0f; // Division durch null vermeiden

  // Gestrichelte Linie auf Höhe des Vortagesschlusses
  int yVortag = CHART_Y + CHART_H - 1 - (int)((vortag - minWert) / spanne * (CHART_H - 1));
  for (int x = CHART_X; x < CHART_X + CHART_W; x += 6) {
    tft.drawFastHLine(x, yVortag, 3, FARBE_LINIE);
  }

  // Bildschirmkoordinaten aller Punkte berechnen
  int px[MAX_PUNKTE], py[MAX_PUNKTE];
  for (uint8_t k = 0; k < n; k++) {
    px[k] = CHART_X + (int)((float)k * (CHART_W - 1) / (n - 1));
    py[k] = CHART_Y + CHART_H - 1 - (int)((daten[i].verlauf[k] - minWert) / spanne * (CHART_H - 1));
  }

  uint16_t linie  = (daten[i].diff >= 0) ? FARBE_GRUEN : FARBE_ROT;
  uint16_t flaeche = (daten[i].diff >= 0) ? FARBE_GRUEN_BG : FARBE_ROT_BG;

  // Durchgang 1: Fläche unter der Kurve füllen
  for (uint8_t k = 1; k < n; k++) {
    for (int x = px[k - 1]; x <= px[k]; x++) {
      int y = py[k - 1];
      if (px[k] != px[k - 1]) {
        y += (py[k] - py[k - 1]) * (x - px[k - 1]) / (px[k] - px[k - 1]);
      }
      tft.drawFastVLine(x, y, CHART_Y + CHART_H - y, flaeche);
    }
  }

  // Durchgang 2: Kurve darüber zeichnen
  for (uint8_t k = 1; k < n; k++) {
    tft.drawLine(px[k - 1], py[k - 1], px[k], py[k], linie);
  }
}

void punkteZeichnen(uint8_t aktiv) {
  int x = BREITE / 2 - ((ANZAHL - 1) * 14) / 2;
  for (uint8_t k = 0; k < ANZAHL; k++) {
    tft.fillCircle(x + k * 14, 228, 3, (k == aktiv) ? FARBE_TEXT : FARBE_GRAU);
  }
}

void uhrzeitZeichnen() {
  struct tm zeit;
  if (!getLocalTime(&zeit, 0)) return;
  if (zeit.tm_sec == letzteSekunde) return; // nur einmal pro Sekunde neu
  letzteSekunde = zeit.tm_sec;

  char puffer[12];
  strftime(puffer, sizeof(puffer), "%H:%M:%S", &zeit);

  // Eingebaute Schrift: kann den Hintergrund gleich mitfüllen -> kein Flackern
  tft.setFont();
  tft.setTextSize(2);
  tft.setTextColor(FARBE_TEXT, FARBE_BAR);
  tft.setCursor(BREITE - 88 - 12, 6);
  tft.print(puffer);
  tft.setTextSize(1);
}

// ---------- Kleine Helfer ----------
void textAn(int x, int grundlinie, const char* txt, const GFXfont* font, uint16_t farbe) {
  tft.setFont(font);
  tft.setTextSize(1);
  tft.setTextColor(farbe);
  tft.setCursor(x, grundlinie); // bei GFX-Schriften ist y die Grundlinie
  tft.print(txt);
}

void statusText(const char* txt) {
  tft.fillScreen(FARBE_BG);
  textAn(20, 125, txt, &FreeSans12pt7b, FARBE_TEXT);
}