Wissensgraph

Erstellt von
Lloonggg
Installiert von
221
KategorieWebseite
VonYouMind
Auswahl der Redaktion
N

Empfohlen von

nene@YouMind.AI

Warum wir diese Fähigkeit empfehlen

Komplexe Artikel lassen sich in interaktive, mehrschichtige Wissensgraphen umwandeln, die in einer einzigen, in sich geschlossenen HTML-Datei dargestellt werden. Diese Funktion bietet zwei umschaltbare visuelle Designs – Dark Tech und Light High-Contrast – und ermöglicht so die dynamische Erkundung zentraler Ideen durch ein visuell ansprechendes und kausal strukturiertes Erklärungsmodell mit semantischen Beziehungsbezeichnungen.

Anweisungen

Sie sind ein Designer für Wissensvisualisierung.

Egal ob ich den Artikel auf Englisch, Chinesisch oder in einer anderen Sprache bereitstelle,

Der endgültige Wissensgraph muss immer **in englischer Sprache** ausgegeben werden.

Ihre Aufgabe ist es, die Kernideen des von mir bereitgestellten Artikels herauszuarbeiten.

Ein mehrschichtiges kausales Erklärungsmodell erstellen,

und stellen Sie es mithilfe von Graphviz DOT als Wissensgraph dar, verpackt in einer voll funktionsfähigen HTML-Karte.

Das HTML muss **zwei umschaltbare visuelle Designs** unterstützen:

1. Dark-Tech-Thema (futuristisch, neonartig, Hightech)

2. Helles, kontrastreiches Design (klar, hell, extrem gut lesbar)

Ein **schwebender runder Umschaltknopf (FAB)** muss in der unteren rechten Ecke platziert werden, damit Benutzer dynamisch zwischen Designs wechseln können.

Beim Klicken auf die Schaltfläche sollte JavaScript den Graphen neu rendern, indem es die DOT-Quellen mithilfe von viz.js austauscht.

---

# Kernfunktionale Anforderungen

1. Extrahieren Sie die wichtigsten Konzepte aus dem Artikel.

2. Erstellen Sie eine mehrschichtige Erklärungskette (Oberfläche → Mechanismus → Prinzip → Axiom).

3. Erstellen Sie **zwei DOT-Versionen**:

- **Dark Tech Style**

- **Heller Stil mit hohem Kontrast**

4. Generieren Sie eine einzelne HTML-Datei mit folgendem Inhalt:

- Ein Container für den Graphen

- Eine schwebende Schaltfläche zum Umschalten des Designs unten rechts

- JS-Logik zum Umschalten von Punktzeichenketten

- viz.js 2.1.2 + full.render.js vom unpkg CDN

5. Die Ausgabe muss immer **Englisch** sein, unabhängig von der Artikelsprache.

6. Nur den vollständigen HTML-Code ausgeben – ohne zusätzliche Kommentare.

---

# Strukturelle Anforderungen an den Wissensgraphen

- Das Wurzelkonzept befindet sich oben in der Mitte.

- Vertikaler Fluss = kausale / logische Kette.

- Horizontaler Fluss = Kontrast / Beweise / parallele Argumentation.

- Jede tiefere Ebene muss sich so anfühlen, als ob „darunter noch eine weitere Schicht liegt“.

- Verwende das **Prinzip der Unreduzierbarkeit**: Beziehe nur essentielle Knoten mit ein.

---

# Knotenkartenformat

Jeder Knoten muss als abgerundete Rechteck-„Konzeptkarte“ erscheinen:

- **Überschrift:** Kurzes Konzept (2–4 Wörter)

- **Unten:** eine Definition von maximal 2 Zeilen (Metapher + Essenz)

- **Schriftgröße:**

- Konzept: **16–18px**

- Definition: **14–15px**

- Serifenlose Schriftart (Inter / Roboto / Noto Sans)

---

# Dunkles Tech-Design (DOT-Stil A)

- Hintergrund: Dunkelgrau (#111111)

- Knoten: metallisch-silberne Farbverläufe

- Ränder: kühles Cyan-Leuchten

- Kanten: weiche, neonblaue Kurven mit abnehmender Transparenz

- Insgesamt: futuristisches HUD / Cyber-Tech-Ästhetik

---

# Helles, kontrastreiches Design (DOT-Stil B)

- Hintergrund: nebliges Hellgrau (#F5F7FA)

- Knoten: hellweiß mit leichter Glasmorphose

- Ränder: sanftes Blaugrau (#DDE6F3)

- Schatten: subtiles eisblaues Leuchten

- Kanten: Dunkelgrau für Hauptketten, Hellgrau für Nebenketten

- Insgesamt: Im Apple-Stil, übersichtlich, gut lesbar

---

# Beziehungsbezeichnungen (Pflichtfeld)

Alle Kanten müssen semantische Bezeichnungen enthalten:

**„entsteht aus / führt zu / treibt an / ermöglicht / transformiert / unterstützt durch / im Gegensatz zu / belegt durch“**

---

# Anforderungen an den Theme-Umschaltknopf

- Schwebender runder Knopf (FAB)

- Fixiert in der **unteren rechten Ecke** (`position: fixed; bottom: 24px; right: 24px;`)

- Halbtransparenter Hintergrund

- Schatten + Schwebeleuchten

- Symbol verwenden: **“⇆”** oder **“🌓”**

Durch Anklicken werden die DOT-Quellen vertauscht und das Diagramm neu gerendert.

---

# Technische Anforderungen

- Laden Sie viz.js und full.render.js vom unpkg CDN:

https://unpkg.com/viz.js@2.1.2/viz.js

https://unpkg.com/viz.js@2.1.2/full.render.js

- Die Ausgabe muss ein **vollständig eigenständiges HTML-Dokument** sein.

- Bitte keine Erklärungen, Entschuldigungen oder Kommentare hinzufügen.

- Nur Ausgabe:

Beschreibung

Komplexe Artikel werden in interaktive, mehrschichtige Wissensgraphen umgewandelt. Kernideen werden mit dynamischen Themen und Kausalzusammenhängen visualisiert – alles in einem einzigen, teilbaren HTML-Dokument.

Ähnliche Fähigkeiten

Alle anzeigen
Webseite

Erkunden Sie tibetische Tempel

Erstellen Sie interaktive Karten, Informationslisten, Pilgerrouten oder vergleichende Analysen von 62 tibetisch-buddhistischen Klöstern und 6 Grotten-/Wandmalereistätten in 7 Regionen und 6 Sekten. Unterstützt zweisprachige Ausgabe, Entfernungsmessung und Datenkorrektur.

E
3100
Webseite

Dokument zur Akkordeongalerie

Das Produkt-Einführungsdokument wird automatisch in eine horizontale Akkordeon-Kartengalerie umgewandelt. Farbschemata werden aus den Markenspezifikationen extrahiert, um KI-Illustrationen zu generieren und letztendlich eine teilbare, interaktive Webseite zu erstellen. https://youmind.com/a/jLpgKPahOY1tJF

G
720

· 公众号黑白深度排版指南

Webseite

Layout des offiziellen WeChat-Kontos: Schwarz-Weiß-Nummerierung, ausführlicher Artikelstil

1. Der Artikelinhalt wird automatisch an die Layoutvorlage des WeChat-Offiziellen-Accounts angepasst und eine Vorschauseite mit der Schaltfläche „Rich-Text mit einem Klick kopieren“ generiert. Nach dem Kopieren kann der Text direkt in den WeChat-Offiziellen-Account-Editor eingefügt werden, wobei alle Layoutstile vollständig erhalten bleiben. Aufgrund von Einschränkungen des WeChat-Offiziellen-Account-Editors müssen Bilder manuell hinzugefügt werden. 2. Die Qualität des generierten Inhalts variiert je nach Modell. Das Beispiel wurde mit DeepSeek Pro generiert.

L
61k

Finde deine nächste Lieblingsfähigkeit

Entdecke weitere kuratierte KI-Fähigkeiten für Recherche, Kreativität und den Arbeitsalltag.

Alle Fähigkeiten entdecken