{"id":2087,"date":"2026-07-08T05:34:20","date_gmt":"2026-07-08T05:34:20","guid":{"rendered":"https:\/\/www.vpascode.com\/de\/docs\/uncategorized\/mermaid-js-wardley-map-syntax-strategy-guide\/"},"modified":"2026-07-08T05:34:20","modified_gmt":"2026-07-08T05:34:20","slug":"mermaid-js-wardley-map-syntax-strategy-guide","status":"publish","type":"ld_docs","link":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/","title":{"rendered":"Mermaid.js Wardley-Map-Syntax &#038; Strategie-Leitfaden"},"content":{"rendered":"<p>Ein Wardley-Map ist ein leistungsstarkes Framework, das f\u00fcr die Gesch\u00e4ftsstrategie verwendet wird, um Wertketten zu visualisieren und die Entwicklung von Komponenten aufzustellen. Eingef\u00fchrt als native Funktion in Mermaid v11.14.0+ erm\u00f6glicht die <code>wardley-beta<\/code>Engine erm\u00f6glicht Strategieteams, Architekten und Produktmanager, Marksumgebungen mithilfe von reiner Textdarstellung abzubilden. Indem technische Komponenten in einem zweidimensionalen Koordinatensystem positioniert werden, k\u00f6nnen Teams Wertkettenabh\u00e4ngigkeiten visuell analysieren, Marktrigidit\u00e4t erkennen und strukturierte Entscheidungen zwischen internem Aufbau und externem Erwerb treffen.<\/p>\n<h2>Verst\u00e4ndnis des Koordinatengittersystems<\/h2>\n<p>Im Gegensatz zu standardm\u00e4\u00dfigen freien Flussdiagrammen wird jeder Bestandteil einer Wardley-Map auf einem starren zweidimensionalen Raum basierend auf zwei Dezimalkoordinaten abgebildet, die sich von <code>0.0<\/code> bis <code>1.0<\/code>:<\/p>\n<ul>\n<li><strong>Sichtbarkeit (Y-Achse \/ Erste Koordinate):<\/strong> Misst, wie sichtbar oder wertvoll ein Bestandteil f\u00fcr einen Endbenutzer ist. Ein Wert von <code>1.0<\/code> steht f\u00fcr einen direkten, benutzerorientierten Ber\u00fchrungspunkt (h\u00f6chste Sichtbarkeit), w\u00e4hrend <code>0.0<\/code> steht f\u00fcr versteckte grundlegende Infrastruktur.<\/li>\n<li><strong>Evolution (X-Achse \/ Zweite Koordinate):<\/strong> Misst das Reifegradniveau eines Marktassets. Es bewegt sich von links nach rechts \u00fcber vier unterschiedliche Entwicklungsphasen: <em>Genesis<\/em> (0.0), <em>Ma\u00dfgeschneidert<\/em> (0.25), <em>Produkt\/Miete<\/em> (0.5), und <em>Kommodit\u00e4t\/Utility<\/em> (0.75 bis 1.0).<\/li>\n<\/ul>\n<h2>Grundlegende Syntaxstruktur<\/h2>\n<p>Jedes Diagramm beginnt mit dem <code>wardley-beta<\/code>Deklarationskopf. Anschlie\u00dfend legen Sie Benutzeranker mit dem <code>Anker<\/code> Schl\u00fcsselwort, zeichnen Sie die operativen Infrastrukturbl\u00f6cke mit dem <code>Komponente<\/code> Schl\u00fcsselwort und zeichnen Sie Beziehungen zwischen ihnen mit gerichteten Pfeilen.<\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">Mermaid<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5SrJLMlJVQjOzC0AUSVFiSWp6ZUKvokFvFyJeckZ+UUKzqXFJfm5qUUK0QZ6ljoKBnqmsbxcyfm5Bfl5qXklCuGpScWZJakgWXOQrAlQFq5F1w4mDwBHQyaX\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">Mermaid<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5SrJLEnNUXDNzEtLTM5IVQguKUosSU3PTM1OLCpJ5eVKzMtOLVLwLs1LSVWINtCz1FEw0DON5eXKzs8tyM9LzStJVQhPTSoGGgKSNgdJmwClIRp07WCSAAWBJbs=\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-mermaid\"><code class=\"language-mermaid\" data-language=\"mermaid\" class=\"language-mermaid\">wardley-beta\r\ntitel Einfache Strategiekarte\r\nanker Kunde [0.9, 0.5]\r\nkomponente Website [0.7, 0.4]\r\nKunde -&gt; Website<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5SrJLEnNUXDNzEtLTM5IVQguKUosSU3PTM1OLCpJ5eVKzMtOLVLwLs1LSVWINtCz1FEw0DON5eXKzs8tyM9LzStJVQhPTSoGGgKSNgdJmwClIRp07WCSAAWBJbs=\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5SrJLMlJVQjOzC0AUSVFiSWp6ZUKvokFvFyJeckZ+UUKzqXFJfm5qUUK0QZ6ljoKBnqmsbxcyfm5Bfl5qXklCuGpScWZJakgWXOQrAlQFq5F1w4mDwBHQyaX\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p>\u00a0<\/p>\n<p id=\"FDfuadJ\"><img fetchpriority=\"high\" alt=\"\" class=\"alignnone size-full wp-image-939\" decoding=\"async\" fetchpriority=\"high\" height=\"600\" sizes=\"(max-width: 900px) 100vw, 900px\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png\" srcset=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png 900w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f-300x200.png 300w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f-768x512.png 768w\" width=\"900\"\/><\/p>\n<h2>Syntaxreferenz<\/h2>\n<p>Die Tabelle unten zeigt die prim\u00e4ren semantischen Bausteine und Parameter auf, die erforderlich sind, um eine Wardley-Karte innerhalb des Mermaid-Kerninterpreters zu strukturieren.<\/p>\n<table border=\"1\" cellpadding=\"5\" cellspacing=\"0\">\n<thead>\n<tr>\n<th>Syntaxkomponente<\/th>\n<th>Typanforderung<\/th>\n<th>Beschreibung und Nutzungsvorschriften<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><strong>Deklaration<\/strong><\/td>\n<td>Schl\u00fcsselwort-Bezeichner<\/td>\n<td>Initialisiert die strategische Rasterkartenfl\u00e4che. Muss genau das <code>wardley-beta<\/code> Block-Zeichenfolge verwenden.<\/td>\n<\/tr>\n<tr>\n<td><strong>Titel<\/strong><\/td>\n<td>Einfacher\/Angef\u00fchrter String<\/td>\n<td>Ein optionaler \u00dcberschrift, der zentriert ganz oben im Diagramm-Raster-Arbeitsbereich gedruckt wird.<\/td>\n<\/tr>\n<tr>\n<td><strong>Gr\u00f6\u00dfenbegrenzungen<\/strong><\/td>\n<td>Eckige Pixel<\/td>\n<td>Ein optionaler benutzerdefinierter Parameter, der verwendet wird, um das Standardraster f\u00fcr Breite und H\u00f6he der Zeichenfl\u00e4che zu \u00fcberschreiben: <code>gr\u00f6\u00dfe [1200, 700]<\/code>.<\/td>\n<\/tr>\n<tr>\n<td><strong>Ankerknoten<\/strong><\/td>\n<td>Schl\u00fcsselwort + Beschriftungen<\/td>\n<td>Legt den zentralen Nutzer oder K\u00e4ufer ganz oben in Ihrer Wertkettengittermatrix fest. Erfordert Koordinatenbereiche: <code>anker K\u00e4ufer [Y, X]<\/code>.<\/td>\n<\/tr>\n<tr>\n<td><strong>Komponentenknoten<\/strong><\/td>\n<td>Schl\u00fcsselwort + Beschriftungen<\/td>\n<td>Erkl\u00e4rt ein eigenst\u00e4ndiges technisches Merkmal oder Asset-Block. Erfordert genaue Positionsgrenzen: <code>komponente Kern-API [Y, X]<\/code>.<\/td>\n<\/tr>\n<tr>\n<td><strong>Verbindungswege<\/strong><\/td>\n<td>Verbindungsoperator<\/td>\n<td>Zeichnet direkte, strukturierte Abh\u00e4ngigkeiten nach unten oder horizontal durch Knoten \u00fcber die <code>-&gt;<\/code> Syntaxregel.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<hr\/>\n<h2>Strategische Aktionssymbole (Bauen, Kaufen, Auslagern, Markt)<\/h2>\n<p>Um strategische Umsetzungspl\u00e4ne explizit zu dokumentieren, erlaubt Mermaid.js das Anh\u00e4ngen von Aktionen an einzelne Komponenten. Diese Aktionen platzieren unterschiedliche Formen auf dem Koordinatenknoten, um architektonische Entscheidungen sofort zu vermitteln:<\/p>\n<table border=\"1\" cellpadding=\"5\" cellspacing=\"0\">\n<thead>\n<tr>\n<th>Aktionmodifikator<\/th>\n<th>Gerendertes Formensymbol<\/th>\n<th>Strategische Absichtskarte<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>(bauen)<\/code><\/td>\n<td>Dreiecksymbol<\/td>\n<td>Die Komponente ist einzigartig, hochriskant oder intern entwickelt, um einen Wettbewerbsvorteil zu erzielen.<\/td>\n<\/tr>\n<tr>\n<td><code>(kaufen)<\/code><\/td>\n<td>Diamantsymbol<\/td>\n<td>Die Komponente wird von einem Drittanbieter-Produktanbieter bezogen oder lizenziert.<\/td>\n<\/tr>\n<tr>\n<td><code>(auslagern)<\/code><\/td>\n<td>Quadratsymbol<\/td>\n<td>Die Komponentenverwaltung wird vollst\u00e4ndig an ein externes Anbieter-Netzwerk delegiert.<\/td>\n<\/tr>\n<tr>\n<td><code>(markt)<\/code><\/td>\n<td>Kreissymbol<\/td>\n<td>Die Komponente ist eine weit verbreitete Hilfsfunktion oder \u00f6ffentliche Ressource.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3>Syntax-Implementierungsbeispiel:<\/h3>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">Mermaid<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5UrOzy3Iz0vNK1FwLi0uyc9VCPVUiDbQszDQUTDQMzaIVdBIKs3MSdFEVhmQWJkLpovyk1OLi\/OLQDpMTEE6zEzBOio1AcVoIG4=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">Mermaid<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5crOzy3Iz0vNK0lVcErNKy2pSi1KSU3LzMtMLUISyk9KLUrLObwkOSNVIdpAz8JAR8FAz9ggVkEjKbE0NU8TxZyoxIyc0rz04oKi\/KrU4uL8IpAWE1OQFjNToJbsxNI0oB4AU4kvpw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-mermaid\"><code class=\"language-mermaid\" data-language=\"mermaid\" class=\"language-mermaid\">wardley-beta\r\nkomponente Benutzerdefinierte Benutzeroberfl\u00e4che [0.80, 0.30] (bauen)\r\nkomponente Zahlungsprozessor [0.45, 0.65] (kaufen)<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5crOzy3Iz0vNK0lVcErNKy2pSi1KSU3LzMtMLUISyk9KLUrLObwkOSNVIdpAz8JAR8FAz9ggVkEjKbE0NU8TxZyoxIyc0rz04oKi\/KrU4uL8IpAWE1OQFjNToJbsxNI0oB4AU4kvpw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNorTyxKyUmt1E1KLUnk5UrOzy3Iz0vNK1FwLi0uyc9VCPVUiDbQszDQUTDQMzaIVdBIKs3MSdFEVhmQWJkLpovyk1OLi\/OLQDpMTEE6zEzBOio1AcVoIG4=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p id=\"AARxkUc\"><img alt=\"\" class=\"alignnone size-full wp-image-940\" decoding=\"async\" height=\"600\" sizes=\"(max-width: 900px) 100vw, 900px\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de30a2df5f.png\" srcset=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de30a2df5f.png 900w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de30a2df5f-300x200.png 300w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de30a2df5f-768x512.png 768w\" width=\"900\"\/><\/p>\n<hr\/>\n<h2>Realit\u00e4tsnaher Bauplan: Wertkette eines handwerklichen Kaffee-Shops<\/h2>\n<p>Dieser umfassende Bauplan verfolgt ein sich ausweitendes Gesch\u00e4ftsmodell f\u00fcr einen Laden. Er skizziert eine vollst\u00e4ndige Kartenarchitektur \u2013 die Konfiguration einer gr\u00f6\u00dferen benutzerdefinierten Gr\u00f6\u00dfenbegrenzung, die Festlegung von Gesch\u00e4ftsankerpunkten, die Setzung spezialisierter Bauen\/Kaufen-Markierungen sowie die Darstellung von Abh\u00e4ngigkeitsverbindungen \u00fcber die Phasen der Achsen hinweg.<\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">Mermaid<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNp1kEFrwkAQhe8L+x8GQaigEsEoXgo2te3BomChB\/Gwbia6mOyG3Q2S\/vpOohWt8bIMy3vzzXtHYeMUy94WveDMK58itCKRILwUTml0DlbeCo+7Ej5F3uLMqR+E9WAQBF0YhcGGM87abYiMvfJMtdwb6zgT9QBvthqUQ1gcNVpYB\/1J2IWgH4abi2imY4gK5012VgSVYhT+IRY50iXKaJESLsuNRu1hLkqsSPLys8pRKpH6klRJgljtGte0YbiBp22h0rhzbVgaRa9JYCUo\/hfaTFUMso1OJwS1rbwxTQs6lIqJ4cN4+KapPnpYg8YVKBP2gP7GNEtReqskbX+3Kiby8WQb1LZJBTKFd6awEjvn3K+Yo45RSwq0F0rDXOmD0jtYCr+n5De99Z7v8nP2v34SNWfm7K480jZE5exBaSRvDMlZU2GP1L+nONVX\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">Mermaid<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNp9kM9qAjEQxu+BvEMQhAqurOAq9lCQYv8gpQehF\/Ew687GkN2sJFmlvoyXXvoCPfW2L9ZkrcJq6SlhZr755vvtQCcZvgcxWqDECosZaz2iWa2rj9QaYzVY5AIlaIssrb41u4e0+mxRwnX1VR2QLfr9MOyyYRQuKaGk3WYz1Iqfd4CSqCmpH\/agQa3WwmDwrNYQu8oi7I2jLgt7UbQ8TU1VIkuVYN0MfXMYnZa\/btDdJLbIZkW+KRQqiyqYxuh+lMhzjc03uBeQSUhTrDeNaptBtGQ3MZSoOo3xN9QSytRY1LlQkHnF8OgdOoXvXUompS1yd4sR6OgY9oSiOuzAmGOsQe038n4voKVtiudWF7lCu9+iNoXmpeJe1K9FY28JpcmAO5ad3+iT2BFVXHCJwhqJ1uKtvzsWKnFys0OOlJzhBXdNBpRc03czl8EpaZJzI\/8EpeQKnPe9DkfJf7j+1vwASVXpkw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-mermaid\"><code class=\"language-mermaid\" data-language=\"mermaid\" class=\"language-mermaid\">wardley-beta\r\ntitel \"Gesch\u00e4ftsstrategiekarte f\u00fcr Caf\u00e9\"\r\ngr\u00f6\u00dfe [1100, 650]\r\n\r\n%% Kerngesch\u00e4ftsanker\r\nanker Franchise-Inhaber [0.95, 0.55]\r\nanker Endkunde [0.90, 0.65]\r\n\r\n%% Operative Komponenten-Ebenen\r\nkomponente Spezialkaffee [0.75, 0.45] (bauen)\r\nkomponente Verkaufsterminal [0.60, 0.60] (kaufen)\r\nkomponente Automatisiertes Hei\u00dfwasser [0.45, 0.75] (Markt)\r\nkomponente Stromnetzversorgung [0.15, 0.90] (auslagern)\r\n\r\n%% Abh\u00e4ngigkeitskette: Verbindungswege\r\nEndkunde -&gt; Spezialkaffee\r\nFranchise-Inhaber -&gt; Verkaufsterminal\r\nSpezialkaffee -&gt; Automatisiertes Hei\u00dfwasser\r\nVerkaufsterminal -&gt; Stromnetzversorgung\r\nAutomatisiertes Hei\u00dfwasser -&gt; Stromnetzversorgung<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNp9kM9qAjEQxu+BvEMQhAqurOAq9lCQYv8gpQehF\/Ew687GkN2sJFmlvoyXXvoCPfW2L9ZkrcJq6SlhZr755vvtQCcZvgcxWqDECosZaz2iWa2rj9QaYzVY5AIlaIssrb41u4e0+mxRwnX1VR2QLfr9MOyyYRQuKaGk3WYz1Iqfd4CSqCmpH\/agQa3WwmDwrNYQu8oi7I2jLgt7UbQ8TU1VIkuVYN0MfXMYnZa\/btDdJLbIZkW+KRQqiyqYxuh+lMhzjc03uBeQSUhTrDeNaptBtGQ3MZSoOo3xN9QSytRY1LlQkHnF8OgdOoXvXUompS1yd4sR6OgY9oSiOuzAmGOsQe038n4voKVtiudWF7lCu9+iNoXmpeJe1K9FY28JpcmAO5ad3+iT2BFVXHCJwhqJ1uKtvzsWKnFys0OOlJzhBXdNBpRc03czl8EpaZJzI\/8EpeQKnPe9DkfJf7j+1vwASVXpkw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit Mermaid in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#mermaid:eNp1kEFrwkAQhe8L+x8GQaigEsEoXgo2te3BomChB\/Gwbia6mOyG3Q2S\/vpOohWt8bIMy3vzzXtHYeMUy94WveDMK58itCKRILwUTml0DlbeCo+7Ej5F3uLMqR+E9WAQBF0YhcGGM87abYiMvfJMtdwb6zgT9QBvthqUQ1gcNVpYB\/1J2IWgH4abi2imY4gK5012VgSVYhT+IRY50iXKaJESLsuNRu1hLkqsSPLys8pRKpH6klRJgljtGte0YbiBp22h0rhzbVgaRa9JYCUo\/hfaTFUMso1OJwS1rbwxTQs6lIqJ4cN4+KapPnpYg8YVKBP2gP7GNEtReqskbX+3Kiby8WQb1LZJBTKFd6awEjvn3K+Yo45RSwq0F0rDXOmD0jtYCr+n5De99Z7v8nP2v34SNWfm7K480jZE5exBaSRvDMlZU2GP1L+nONVX\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Mermaid in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p id=\"IqhvEpm\"><img alt=\"\" class=\"alignnone size-full wp-image-941\" decoding=\"async\" height=\"650\" sizes=\"(max-width: 1100px) 100vw, 1100px\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de320944ae.png\" srcset=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de320944ae.png 1100w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de320944ae-300x177.png 300w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de320944ae-1024x605.png 1024w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de320944ae-768x454.png 768w\" width=\"1100\"\/><\/p>\n<hr\/>\n<p><em><strong>Syntax-Tipp:<\/strong> Bei der Deklaration von Koordinaten-Arrays beachten Sie, dass der vertikale Y-Wert (Sichtbarkeit) *zuerst* kommt und der horizontale X-Wert (Entwicklung) *zweitens* folgt<code>[Sichtbarkeit, Entwicklung]<\/code>. Die Umkehrung dieser Positionen ist die h\u00e4ufigste Ursache daf\u00fcr, dass Komponenten falsch entlang des unteren Randes Ihrer Kartenfl\u00e4che gruppiert werden.<\/em><\/p>\n<hr\/>\n<h2>H\u00e4ufige Syntax-Fehler &amp; Systembeschr\u00e4nkungen<\/h2>\n<p>Beim Kompilieren von Wertkettenr\u00e4umen sollten Sie diese drei Layout-Grenzen im Auge behalten, um sicherzustellen, dass Ihr Text sauber gerendert wird:<\/p>\n<ul>\n<li><strong>Strenge Koordinatenbereiche:<\/strong> Die Positionen m\u00fcssen genau innerhalb der Dezimalklammern zwischen <code>0.0<\/code> und <code>1.0<\/code>. Die Verwendung absoluter ganzzahliger Pixel (wie <code>[400, 200]<\/code>) anstelle von Layout-Verh\u00e4ltnissen innerhalb der Knotenargumente l\u00f6st einen Systemausf\u00fchrungsfehler aus.<\/li>\n<li><strong>Deklarationsreihenfolge f\u00fcr Verbindungen:<\/strong> F\u00fcr eine saubere Layout-Darstellung stellen Sie sicher, dass alle Ihre <code>anker<\/code> und <code>komponente<\/code>Bezeichnungen werden deklariert und mit Koordinaten versehen *vor* der Schreibweise beliebiger Knoten-Beziehungslinien (<code>A -&gt; B<\/code>). Das Verkn\u00fcpfen mit einer nicht deklarierten Bezeichnung kann die Positionierung der Kartenachsen st\u00f6ren.<\/li>\n<li><strong>Bezeichnungsraum-Einschlie\u00dfungen:<\/strong> Wenn ein Komponentenname Leerzeichen, Symbole oder Kommata enth\u00e4lt, stellen Sie sicher, dass er genau geschrieben ist. Das erneute Verwenden von nicht \u00fcbereinstimmenden Zeichenfolgen in Verbindungspfaden erstellt einen v\u00f6llig neuen, nicht positionierten Knoten auf der Rasterfl\u00e4che.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Ein Wardley-Map ist ein leistungsstarkes Framework, das f\u00fcr die Gesch\u00e4ftsstrategie verwendet wird, um Wertketten zu visualisieren und die Entwicklung von Komponenten aufzustellen. Eingef\u00fchrt als native Funktion in Mermaid v11.14.0+ erm\u00f6glicht die wardley-betaEngine erm\u00f6glicht Strategieteams, Architekten und Produktmanager, Marksumgebungen mithilfe von&#8230;<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":18,"template":"","meta":{"inline_featured_image":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"ld_collection":[14],"class_list":["post-2087","ld_docs","type-ld_docs","status-publish","hentry","ld_collection-vpascode-docs"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide<\/title>\n<meta name=\"description\" content=\"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide\" \/>\n<meta property=\"og:description\" content=\"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"4\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/\",\"name\":\"Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a4de2fd2de7f.png\",\"datePublished\":\"2026-07-08T05:34:20+00:00\",\"description\":\"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a4de2fd2de7f.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/img_6a4de2fd2de7f.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/vpascode-docs\\\/mermaid-js-wardley-map-syntax-strategy-guide\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Lean Docs\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/docs\\\/%ld_collection%\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Mermaid.js Wardley-Map-Syntax &#038; Strategie-Leitfaden\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#website\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/\",\"name\":\"VPasCode\",\"description\":\"by Visual Paradigm\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#organization\",\"name\":\"VPasCode\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/wp-content\\\/uploads\\\/sites\\\/4\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/wp-content\\\/uploads\\\/sites\\\/4\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"width\":128,\"height\":138,\"caption\":\"VPasCode\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/de\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide","description":"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/","og_locale":"de_DE","og_type":"article","og_title":"Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide","og_description":"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.","og_url":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/","og_site_name":"VPasCode","og_image":[{"url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"4\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/","url":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/","name":"Mermaid Wardley Map Syntax | VPasCode Text to Diagram Guide","isPartOf":{"@id":"https:\/\/www.vpascode.com\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png","datePublished":"2026-07-08T05:34:20+00:00","description":"Design strategic value chains and business landscapes with Mermaid Wardley maps in VPasCode, a diagram-as-code tool.","breadcrumb":{"@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/#primaryimage","url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png","contentUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/07\/img_6a4de2fd2de7f.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/de\/docs\/vpascode-docs\/mermaid-js-wardley-map-syntax-strategy-guide\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/de\/"},{"@type":"ListItem","position":2,"name":"Lean Docs","item":"https:\/\/www.vpascode.com\/de\/docs\/%ld_collection%\/"},{"@type":"ListItem","position":3,"name":"Mermaid.js Wardley-Map-Syntax &#038; Strategie-Leitfaden"}]},{"@type":"WebSite","@id":"https:\/\/www.vpascode.com\/de\/#website","url":"https:\/\/www.vpascode.com\/de\/","name":"VPasCode","description":"by Visual Paradigm","publisher":{"@id":"https:\/\/www.vpascode.com\/de\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vpascode.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/www.vpascode.com\/de\/#organization","name":"VPasCode","url":"https:\/\/www.vpascode.com\/de\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.vpascode.com\/de\/#\/schema\/logo\/image\/","url":"https:\/\/www.vpascode.com\/de\/wp-content\/uploads\/sites\/4\/2026\/06\/cropped-vp-online-logo-v1.png","contentUrl":"https:\/\/www.vpascode.com\/de\/wp-content\/uploads\/sites\/4\/2026\/06\/cropped-vp-online-logo-v1.png","width":128,"height":138,"caption":"VPasCode"},"image":{"@id":"https:\/\/www.vpascode.com\/de\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/ld_docs\/2087","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/ld_docs"}],"about":[{"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/types\/ld_docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/users\/3"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/media?parent=2087"}],"wp:term":[{"taxonomy":"ld_collection","embeddable":true,"href":"https:\/\/www.vpascode.com\/de\/wp-json\/wp\/v2\/ld_collection?post=2087"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}