Vorlage:Beispielgraph: Unterschied zwischen den Versionen

Aus KGS-Wiki
Vorlage erstellt
 
Keine Bearbeitungszusammenfassung
 
(3 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
{{Thumbnailbox|INHALT=<onlyinclude>{{#mermaid:graph LR
{{Thumbnailbox|INHALT=<onlyinclude>{{#mermaid:graph LR
a((A))
a(({{{ATEXT|A}}}))
b((B))
b(({{{BTEXT|B}}}))
c((C))
c(({{{CTEXT|C}}}))
d((D))
d(({{{DTEXT|D}}}))
e((E))
e(({{{ETEXT|E}}}))
a -- 3 --- b
a -- {{{ABWT|3}}} --- b
b -- 7 --- c
b -- {{{BCWT|7}}} --- c
a -- 1 --- c
a -- {{{ACWT|1}}} --- c
b -- 5 --- d
b -- {{{BDWT|5}}} --- d
b -- 1 --- e
b -- {{{BEWT|1}}} --- e
c -- 2 --- d
c -- {{{CDWT|2}}} --- d
d -- 7 --- e
d -- {{{DEWT|7}}} --- e
{{{ADDITA|}}}
style a fill:{{{A|{{{node|}}}}}};
style a fill:{{{A|{{{node|}}}}}};
style b fill:{{{B|{{{node|}}}}}};
style b fill:{{{B|{{{node|}}}}}};
Zeile 25: Zeile 26:
{{#if:{{{CD|}}}|linkStyle 5 stroke:{{{CD}}}, fill:none;|}}
{{#if:{{{CD|}}}|linkStyle 5 stroke:{{{CD}}}, fill:none;|}}
{{#if:{{{DE|}}}|linkStyle 6 stroke:{{{DE}}}, fill:none;|}}
{{#if:{{{DE|}}}|linkStyle 6 stroke:{{{DE}}}, fill:none;|}}
}}</onlyinclude>|CAPTION=<code><nowiki>{{Beispielgraph}}</nowiki></code>}}
}}
</onlyinclude>|CAPTION=<code><nowiki>{{Beispielgraph}}</nowiki></code>}}
<noinclude>
<noinclude>
Dieser Graph kann als Beispiel genutzt werden, um den Ablauf von Graphalgorithmen zu illustrieren. Die Farben der Knoten können mit den Parametern <code>A</code> bis <code>E</code> festgelegt werden, der Parameter <code>node</code> legt eine Standardfarbe für alle nicht anderweitig definierten Knoten fest. Ähnlich können mit den Parametern <code>AB</code>, <code>AC</code>, <code>BC</code> usw. die Farben der Kanten <math>\overline{AB}</math>, <math>\overline{AC}</math>, <math>\overline{BC}</math> usw. festgelegt werden. Die Standardfarbe für Kanten kann mit dem Parameter <code>link</code> festgelegt werden. Für Farben ist die CSS-Syntax zu verwenden. Bei der Angabe von hexadezimalen RGB-Farbwerten müssen Großbuchstaben verwendet werden.
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|E=blue|BD=#10AEBE|BDWT=-5}}</nowiki></code>
 
|INHALT={{Beispielgraph|E=blue|BD=#10AEBE|BDWT=-5}}}}
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|E=blue|BD=#10AEBE}}</nowiki></code>
|INHALT={{Beispielgraph|E=blue|BD=#10AEBE}}}}
 
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|node=#ABCDEF|link=fuchsia}}</nowiki></code>
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|node=#ABCDEF|link=fuchsia}}</nowiki></code>
|INHALT={{Beispielgraph|node=#ABCDEF|link=fuchsia}}}}
|INHALT={{Beispielgraph|node=#ABCDEF|link=fuchsia}}}}
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|A=red|B=#C0FFEE|node=green</nowiki></code><br/><code><nowiki>|AB=#BADB01|CD=black|link=pink}}</nowiki></code>
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|A=red|B=#C0FFEE|node=green</nowiki></code><br/><code><nowiki>|AB=#BADB01|CD=black|link=pink}}</nowiki></code>
|INHALT={{Beispielgraph|A=red|B=#C0FFEE|node=green|AB=#BADB01|CD=black|link=pink}}}}
|INHALT={{Beispielgraph|A=red|B=#C0FFEE|node=green|AB=#BADB01|CD=black|link=pink}}}}
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|A=red|B=#FA7B01</nowiki></code><br/><code><nowiki>|ADDITA=f{F}; a -- 2 --- f; b -- 4 --- f}}</nowiki></code>
|INHALT={{Beispielgraph|A=red|B=#FA7B01|ADDITA=f{F}; a -- 2 --- f; b -- 4 --- f}}}}
{{Thumbnailbox|CAPTION=<code><nowiki>{{Beispielgraph|link=green</nowiki></code><br/><code><nowiki>|ADDITA=subgraph abc; a; b; c; end|BTEXT=Not B}}</nowiki></code>
|INHALT={{Beispielgraph|link=green|ADDITA=subgraph abc; a; b; c; end; b((Not B))}}}}
Dieser Graph kann als Beispiel genutzt werden, um den Ablauf von Graphalgorithmen zu illustrieren. Die Farben der Knoten können mit den Parametern <code>A</code> bis <code>E</code> festgelegt werden, der Parameter <code>node</code> legt eine Standardfarbe für alle nicht anderweitig definierten Knoten fest. Ähnlich können mit den Parametern <code>AB</code>, <code>AC</code>, <code>BC</code> usw. die Farben der Kanten <math>\overline{AB}</math>, <math>\overline{AC}</math>, <math>\overline{BC}</math> usw. festgelegt werden. Die Standardfarbe für Kanten kann mit dem Parameter <code>link</code> festgelegt werden. Für Farben ist die CSS-Syntax zu verwenden. Der Parameter <code>ADDITA</code> darf weitere Elemente in Mermaid-Syntax enthalten, etwa weitere Knoten und Kanten oder Subgraphen; diese müssen mit Semikola getrennt sein.


{{Info|Diese Vorlage erzeugt nur ungerichtete Graphen. Für gerichtete Graphen ist die [[Vorlage:Beispielgraph/gerichtet]] geeignet.}}


<templatedata>
{{Dokumentation}}
{
"params": {
"A": {
"label": "Knotenfarbe A",
            "description": "",
"example": "#C0FFEE",
"type": "string"
},
"node": {
"label": "Standard-Knotenfarbe",
            "description": "",
"example": "red",
"type": "string"
},
"B": {
"label": "Knotenfarbe B",
            "description": "",
"example": "none",
"type": "string"
},
"C": {
"label": "Knotenfarbe C",
            "description": "",
"example": "purple",
"type": "string"
},
"D": {
"label": "Knotenfarbe D",
            "description": "",
"example": "lightblue",
"type": "string"
},
"E": {
"label": "Knotenfarbe E",
            "description": "",
"example": "#424242",
"type": "string"
},
"link": {
"label": "Standard-Kantenfarbe",
            "description": "",
"example": "green",
"type": "string"
},
"AB": {
"label": "Kantenfarbe AB",
            "description": "",
"example": "teal",
"type": "string"
},
"BC": {
"label": "Kantenfarbe BC",
            "description": "",
"example": "#C01012",
"type": "string"
},
"AC": {
"label": "Kantenfarbe AC",
            "description": "",
"example": "#41BABE",
"type": "string"
},
"BD": {
"label": "Kantenfarbe BD",
            "description": "",
"example": "#7A551E",
"type": "string"
},
"BE": {
"label": "Kantenfarbe BE",
            "description": "",
"example": "crimson",
"type": "string"
},
"CD": {
"label": "Kantenfarbe CD",
            "description": "",
"example": "black",
"type": "string"
},
"DE": {
"label": "Kantenfarbe DE",
            "description": "",
"example": "#BADA55",
"type": "string"
}
},
    "description": "",
"paramOrder": [
"node",
"A",
"B",
"C",
"D",
"E",
"link",
"AB",
"AC",
"BC",
"BD",
"BE",
"CD",
"DE"
],
"format": "inline"
}
</templatedata>
 
</noinclude>
</noinclude>

Aktuelle Version vom 12. November 2024, 15:04 Uhr

{{Beispielgraph}}
{{Beispielgraph|E=blue|BD=#10AEBE|BDWT=-5}}
{{Beispielgraph|node=#ABCDEF|link=fuchsia}}
{{Beispielgraph|A=red|B=#C0FFEE|node=green
|AB=#BADB01|CD=black|link=pink}}
{{Beispielgraph|A=red|B=#FA7B01
|ADDITA=f{F}; a -- 2 --- f; b -- 4 --- f}}
{{Beispielgraph|link=green
|ADDITA=subgraph abc; a; b; c; end|BTEXT=Not B}}

Dieser Graph kann als Beispiel genutzt werden, um den Ablauf von Graphalgorithmen zu illustrieren. Die Farben der Knoten können mit den Parametern A bis E festgelegt werden, der Parameter node legt eine Standardfarbe für alle nicht anderweitig definierten Knoten fest. Ähnlich können mit den Parametern AB, AC, BC usw. die Farben der Kanten AB, AC, BC usw. festgelegt werden. Die Standardfarbe für Kanten kann mit dem Parameter link festgelegt werden. Für Farben ist die CSS-Syntax zu verwenden. Der Parameter ADDITA darf weitere Elemente in Mermaid-Syntax enthalten, etwa weitere Knoten und Kanten oder Subgraphen; diese müssen mit Semikola getrennt sein.

ℹ️
Info

Diese Vorlage erzeugt nur ungerichtete Graphen. Für gerichtete Graphen ist die Vorlage:Beispielgraph/gerichtet geeignet.

Keine Beschreibung.

Vorlagenparameter[Vorlagendaten bearbeiten]

Diese Vorlage bevorzugt Inline-Formatierung von Parametern.

ParameterBeschreibungTypStatus
Standard-Knotenfarbenode

keine Beschreibung

Beispiel
red
Mehrzeiliger Textoptional
KnotenfarbeA B C D E

Für jeden Knoten kann eine individuelle Farbe vergeben werden, entweder als CSS-Farbname oder als RGB-Hex-Code.

Beispiel
red, blue, #C0FFEE
Mehrzeiliger Textoptional
KnotenbeschriftungenATEXT BTEXT CTEXT DTEXT ETEXT

Für jeden Knoten kann eine andere Beschriftung angegeben werden. Soll zusätzlich auch die Form des Knotens geändert werden, muss dies in <code>ADDITA</code> angegeben werden.

Standard
A, B, C, D, E
Mehrzeiliger Textoptional
Standard-Kantenfarbelink

keine Beschreibung

Beispiel
green
Mehrzeiliger Textoptional
KantenfarbenAB AC BC BD BE CD DE

Für jede Kante kann eine individuelle Farbe angegeben werden, sei es als CSS-Farbname, sei es als RGB-Hex-Code

Beispiel
teal, #BADB01, #C01012
Mehrzeiliger Textoptional
KantengewichteABWT ACWT BCWT BDWT BEWT CDWT DEWT

Für jede Kante kann das Gewicht individuell verändert werden.

Standard
ABWT = 3, ACWT = 1, BCWT = 7, BDWT = 5, BEWT = 1, CDWT = 2, DEWT = 7
Beispiel
42
Zahlenwertoptional
Weitere Mermaid-BefehleADDITA

Unter diesem Parameter kann weiterer Mermaid-Code eingefügt werden, etwa um neue Knoten und Kanten hinzuzufügen oder bestehende zu ändern. Die einzelnen Anweisungen müssen mit Semikola getrennt werden.

Beispiel
newNode(["Noch ein Knoten"]); a -- 42 --- newNode
Mehrzeiliger Textoptional