{"id":991,"date":"2026-07-09T09:42:51","date_gmt":"2026-07-09T09:42:51","guid":{"rendered":"https:\/\/www.vpascode.com\/tw\/?page_id=991"},"modified":"2026-07-29T07:38:23","modified_gmt":"2026-07-29T07:38:23","slug":"diagrams","status":"publish","type":"page","link":"https:\/\/www.vpascode.com\/tw\/diagrams\/","title":{"rendered":"Diagrams"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"991\" class=\"elementor elementor-991\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1fd973b e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"1fd973b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-b5e7466 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"b5e7466\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5ba6d182 animated-slow elementor-invisible elementor-widget elementor-widget-elementskit-heading\" data-id=\"5ba6d182\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInUp&quot;}\" data-widget_type=\"elementskit-heading.default\">\n\t\t\t\t\t<div class=\"ekit-wid-con\" ><div class=\"ekit-heading elementskit-section-title-wraper text_center   ekit_heading_tablet-   ekit_heading_mobile-\"><h1 class=\"ekit-heading--title elementskit-section-title \">Supported Diagram Types in VPasCode<\/h1>\t\t\t\t<div class='ekit-heading__description'>\n\t\t\t\t\t<p>VPasCode brings PlantUML, Mermaid, Graphviz, ECharts, and Markmap together in one unified workspace. Try our <a class=\"ng-star-inserted\" href=\"https:\/\/www.vpascode.com\/overview\/\" target=\"_blank\" rel=\"noopener\">diagram-as-code tool<\/a> to streamline your architectural documentation.<\/p>\n\t\t\t\t<\/div>\n\t\t\t<\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e061777 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"e061777\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2538242 e-n-tabs-mobile elementor-widget elementor-widget-n-tabs\" data-id=\"2538242\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;horizontal_scroll&quot;:&quot;disable&quot;}\" data-widget_type=\"nested-tabs.default\">\n\t\t\t\t\t\t\t<div class=\"e-n-tabs\" data-widget-number=\"39027266\" aria-label=\"Tabs. Open items with Enter or Space, close with Escape and navigate using the Arrow keys.\">\n\t\t\t<div class=\"e-n-tabs-heading\" role=\"tablist\">\n\t\t\t\t\t<button id=\"e-n-tab-title-390272661\" data-tab-title-id=\"e-n-tab-title-390272661\" class=\"e-n-tab-title\" aria-selected=\"true\" data-tab-index=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"e-n-tab-content-390272661\" style=\"--n-tabs-title-order: 1;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tPlantUML\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272662\" data-tab-title-id=\"e-n-tab-title-390272662\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272662\" style=\"--n-tabs-title-order: 2;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tMermaid.js\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272663\" data-tab-title-id=\"e-n-tab-title-390272663\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"3\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272663\" style=\"--n-tabs-title-order: 3;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tGraphviz\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272664\" data-tab-title-id=\"e-n-tab-title-390272664\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"4\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272664\" style=\"--n-tabs-title-order: 4;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tECharts\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272665\" data-tab-title-id=\"e-n-tab-title-390272665\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"5\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272665\" style=\"--n-tabs-title-order: 5;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tMarkmap\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t\t<\/div>\n\t\t\t<div class=\"e-n-tabs-content\">\n\t\t\t\t<div id=\"e-n-tab-content-390272661\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272661\" data-tab-index=\"1\" style=\"--n-tabs-title-order: 1;\" class=\"e-active elementor-element elementor-element-38bc7b7 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"38bc7b7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-f806b3e e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f806b3e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5bca084 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"5bca084\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-145675e elementor-widget elementor-widget-heading\" data-id=\"145675e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">PlantUML Support<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aa2b979 elementor-widget elementor-widget-text-editor\" data-id=\"aa2b979\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>PlantUML in VPasCode gives software architects a robust <b data-path-to-node=\"11,1,0\" data-index-in-node=\"69\">diagram-as-code tool<\/b> to model complex systems. Easily turn plain text into formal UML class, sequence, activity, and C4 architecture diagrams.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0d204e4 e-grid e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"0d204e4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<a class=\"elementor-element elementor-element-f3b4074 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f3b4074\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-use-case-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6ca81a3 elementor-widget elementor-widget-image\" data-id=\"6ca81a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"331\" height=\"187\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png\" class=\"attachment-large size-large wp-image-500\" alt=\"PlantUML use case diagram generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png 331w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92-300x169.png 300w\" sizes=\"(max-width: 331px) 100vw, 331px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4b8592b elementor-widget elementor-widget-heading\" data-id=\"4b8592b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Use Case Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-469ac5b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"469ac5b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-class-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-171d376 elementor-widget elementor-widget-image\" data-id=\"171d376\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"259\" height=\"273\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18f8074ea12.png\" class=\"attachment-large size-large wp-image-557\" alt=\"PlantUML class diagram rendered from code using VPasCode text to diagram engine\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1d1d377 elementor-widget elementor-widget-heading\" data-id=\"1d1d377\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Class Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-6401c77 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6401c77\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-sequence-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8bb6538 elementor-widget elementor-widget-image\" data-id=\"8bb6538\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"455\" height=\"392\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fd5649b30.png\" class=\"attachment-large size-large wp-image-564\" alt=\"PlantUML sequence diagram created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fd5649b30.png 455w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fd5649b30-300x258.png 300w\" sizes=\"(max-width: 455px) 100vw, 455px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1599a3e elementor-widget elementor-widget-heading\" data-id=\"1599a3e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sequence Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-2003f78 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"2003f78\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-activity-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c1e0e77 elementor-widget elementor-widget-image\" data-id=\"c1e0e77\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"480\" height=\"721\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fe65178d1.png\" class=\"attachment-large size-large wp-image-571\" alt=\"PlantUML activity diagram workflow rendered from text in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fe65178d1.png 480w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fe65178d1-200x300.png 200w\" sizes=\"(max-width: 480px) 100vw, 480px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-401503b elementor-widget elementor-widget-heading\" data-id=\"401503b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Activity Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-9df3fc4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"9df3fc4\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e04a3f0 elementor-widget elementor-widget-image\" data-id=\"e04a3f0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"273\" height=\"279\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18fed4616f4.png\" class=\"attachment-large size-large wp-image-575\" alt=\"PlantUML state machine diagram generated using VPasCode diagram-as-code tool\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a29bc8b elementor-widget elementor-widget-heading\" data-id=\"a29bc8b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">State Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-1630419 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"1630419\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-object-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1467590 elementor-widget elementor-widget-image\" data-id=\"1467590\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"470\" height=\"233\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18ffc981a53.png\" class=\"attachment-large size-large wp-image-582\" alt=\"PlantUML object diagram model rendered in VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18ffc981a53.png 470w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a18ffc981a53-300x149.png 300w\" sizes=\"(max-width: 470px) 100vw, 470px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-53e9b7b elementor-widget elementor-widget-heading\" data-id=\"53e9b7b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Object Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-cb4d432 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"cb4d432\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-component-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e677bae elementor-widget elementor-widget-image\" data-id=\"e677bae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"472\" height=\"577\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19002718bf6.png\" class=\"attachment-large size-large wp-image-588\" alt=\"PlantUML component architecture diagram created in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19002718bf6.png 472w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19002718bf6-245x300.png 245w\" sizes=\"(max-width: 472px) 100vw, 472px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-65d2f47 elementor-widget elementor-widget-heading\" data-id=\"65d2f47\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Component Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-a33d9f5 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"a33d9f5\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-deployment-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3908519 elementor-widget elementor-widget-image\" data-id=\"3908519\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"362\" height=\"721\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19009dbf8f1.png\" class=\"attachment-large size-large wp-image-594\" alt=\"PlantUML deployment architecture created using VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19009dbf8f1.png 362w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19009dbf8f1-151x300.png 151w\" sizes=\"(max-width: 362px) 100vw, 362px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-99ba281 elementor-widget elementor-widget-heading\" data-id=\"99ba281\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Deployment Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-c433bc2 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"c433bc2\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-timing-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d39ad83 elementor-widget elementor-widget-image\" data-id=\"d39ad83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"554\" height=\"196\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1900e30fbf7.png\" class=\"attachment-large size-large wp-image-597\" alt=\"PlantUML timing diagram generated from text script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1900e30fbf7.png 554w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1900e30fbf7-300x106.png 300w\" sizes=\"(max-width: 554px) 100vw, 554px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2f76f6b elementor-widget elementor-widget-heading\" data-id=\"2f76f6b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Timing Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-80726f3 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"80726f3\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-erd-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-60216fd elementor-widget elementor-widget-image\" data-id=\"60216fd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"301\" height=\"444\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19012676e1c.png\" class=\"attachment-large size-large wp-image-601\" alt=\"PlantUML entity relationship diagram created using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19012676e1c.png 301w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19012676e1c-203x300.png 203w\" sizes=\"(max-width: 301px) 100vw, 301px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a3727b7 elementor-widget elementor-widget-heading\" data-id=\"a3727b7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">ERD Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-b35854b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"b35854b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-archimate-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dba0396 elementor-widget elementor-widget-image\" data-id=\"dba0396\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"533\" height=\"740\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1901b079e3a.png\" class=\"attachment-large size-large wp-image-607\" alt=\"PlantUML ArchiMate enterprise architecture diagram rendered in VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1901b079e3a.png 533w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1901b079e3a-216x300.png 216w\" sizes=\"(max-width: 533px) 100vw, 533px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-055d3fc elementor-widget elementor-widget-heading\" data-id=\"055d3fc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">ArchiMate Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-aea0ae4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"aea0ae4\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-c4-model-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2f4c702 elementor-widget elementor-widget-image\" data-id=\"2f4c702\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"759\" height=\"728\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19024586a43.png\" class=\"attachment-large size-large wp-image-612\" alt=\"PlantUML C4 model system architecture diagram generated inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19024586a43.png 759w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19024586a43-300x288.png 300w\" sizes=\"(max-width: 759px) 100vw, 759px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-80ad9bf elementor-widget elementor-widget-heading\" data-id=\"80ad9bf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">C4 Model Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div id=\"e-n-tab-content-390272662\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272662\" data-tab-index=\"2\" style=\"--n-tabs-title-order: 2;\" class=\" elementor-element elementor-element-b5c389b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"b5c389b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-f22e179 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f22e179\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-bc9c340 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"bc9c340\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7aaa72d elementor-widget elementor-widget-heading\" data-id=\"7aaa72d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Mermaid.js Support<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5acb02a elementor-widget elementor-widget-text-editor\" data-id=\"5acb02a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Designed for rapid developer documentation, VPasCode incorporates Mermaid as a light and flexible <b data-path-to-node=\"14,1,0\" data-index-in-node=\"111\">diagram-as-code tool<\/b>. Generate flowcharts, user journeys, Gantt project timelines, and Git graphs in seconds.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5cc47bb e-grid e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"5cc47bb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<a class=\"elementor-element elementor-element-10b3d3b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"10b3d3b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-flowchart-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-64c410d elementor-widget elementor-widget-image\" data-id=\"64c410d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"511\" height=\"644\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1902d48117d.png\" class=\"attachment-large size-large wp-image-617\" alt=\"Mermaid flowchart diagram generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1902d48117d.png 511w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1902d48117d-238x300.png 238w\" sizes=\"(max-width: 511px) 100vw, 511px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eb006f1 elementor-widget elementor-widget-heading\" data-id=\"eb006f1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Flowchart Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-4bb40b9 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"4bb40b9\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-class-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8fff95d elementor-widget elementor-widget-image\" data-id=\"8fff95d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"731\" height=\"450\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190321054b5.png\" class=\"attachment-large size-large wp-image-622\" alt=\"Mermaid class diagram rendered from code using VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190321054b5.png 731w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190321054b5-300x185.png 300w\" sizes=\"(max-width: 731px) 100vw, 731px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ea49a6b elementor-widget elementor-widget-heading\" data-id=\"ea49a6b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Class Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-41f8fb8 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"41f8fb8\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-sequence-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a98e386 elementor-widget elementor-widget-image\" data-id=\"a98e386\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"939\" height=\"829\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903768417b.png\" class=\"attachment-large size-large wp-image-627\" alt=\"Mermaid sequence diagram created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903768417b.png 939w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903768417b-300x265.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903768417b-768x678.png 768w\" sizes=\"(max-width: 939px) 100vw, 939px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-caf378b elementor-widget elementor-widget-heading\" data-id=\"caf378b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sequence Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-f24f1f9 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f24f1f9\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-erd-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7f52b4d elementor-widget elementor-widget-image\" data-id=\"7f52b4d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"709\" height=\"545\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903d115d5e.png\" class=\"attachment-large size-large wp-image-633\" alt=\"Mermaid entity relationship diagram generated using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903d115d5e.png 709w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1903d115d5e-300x231.png 300w\" sizes=\"(max-width: 709px) 100vw, 709px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0b455af elementor-widget elementor-widget-heading\" data-id=\"0b455af\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">ERD Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-a4da3e0 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"a4da3e0\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-state-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4cadb36 elementor-widget elementor-widget-image\" data-id=\"4cadb36\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"1024\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904232f697-360x1024.png\" class=\"attachment-large size-large wp-image-639\" alt=\"Mermaid state diagram created from text script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904232f697-360x1024.png 360w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904232f697.png 381w\" sizes=\"(max-width: 360px) 100vw, 360px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bbb8e08 elementor-widget elementor-widget-heading\" data-id=\"bbb8e08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">State Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d648ad2 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"d648ad2\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-mind-map-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a801cb2 elementor-widget elementor-widget-image\" data-id=\"a801cb2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"729\" height=\"482\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190462044fb.png\" class=\"attachment-large size-large wp-image-642\" alt=\"Mermaid mind map rendered from plain text in VPasCode text to diagram tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190462044fb.png 729w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190462044fb-300x198.png 300w\" sizes=\"(max-width: 729px) 100vw, 729px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bbb69e2 elementor-widget elementor-widget-heading\" data-id=\"bbb69e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Mind Map<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-97cafb0 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"97cafb0\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-gantt-chart-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dfb22ff elementor-widget elementor-widget-image\" data-id=\"dfb22ff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"584\" height=\"220\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19049caf4ef.png\" class=\"attachment-large size-large wp-image-646\" alt=\"Mermaid Gantt project chart generated inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19049caf4ef.png 584w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a19049caf4ef-300x113.png 300w\" sizes=\"(max-width: 584px) 100vw, 584px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-436117f elementor-widget elementor-widget-heading\" data-id=\"436117f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Gantt Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-4c8e933 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"4c8e933\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-quadrant-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dd31852 elementor-widget elementor-widget-image\" data-id=\"dd31852\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"500\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904c8c4a0b.png\" class=\"attachment-large size-large wp-image-649\" alt=\"Mermaid quadrant matrix chart created using VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904c8c4a0b.png 500w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904c8c4a0b-300x300.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904c8c4a0b-150x150.png 150w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-98cec65 elementor-widget elementor-widget-heading\" data-id=\"98cec65\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Quadrant Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-2bc7be2 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"2bc7be2\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-timeline-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d514237 elementor-widget elementor-widget-image\" data-id=\"d514237\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"577\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904e878b33-1024x577.png\" class=\"attachment-large size-large wp-image-652\" alt=\"Mermaid timeline diagram rendered from code script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904e878b33-1024x577.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904e878b33-300x169.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904e878b33-768x432.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1904e878b33.png 1190w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-880e53b elementor-widget elementor-widget-heading\" data-id=\"880e53b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Timeline<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-6948567 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6948567\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-user-journey-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9ff4f09 elementor-widget elementor-widget-image\" data-id=\"9ff4f09\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"423\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4620ebf38f5-1024x423.png\" class=\"attachment-large size-large wp-image-898\" alt=\"Mermaid user journey map created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4620ebf38f5-1024x423.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4620ebf38f5-300x124.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4620ebf38f5-768x317.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4620ebf38f5.png 1308w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f505e58 elementor-widget elementor-widget-heading\" data-id=\"f505e58\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">User Journey<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-84dd8f6 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"84dd8f6\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-venn-diagram-syntax-layout-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-619cf45 elementor-widget elementor-widget-image\" data-id=\"619cf45\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4629c718741.png\" class=\"attachment-large size-large wp-image-903\" alt=\"Mermaid Venn diagram generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4629c718741.png 800w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4629c718741-300x169.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4629c718741-768x432.png 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cdd6619 elementor-widget elementor-widget-heading\" data-id=\"cdd6619\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Venn Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-7889edb e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"7889edb\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-pie-chart-syntax-data-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c79f35c elementor-widget elementor-widget-image\" data-id=\"c79f35c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"450\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a463155bf5dd.png\" class=\"attachment-large size-large wp-image-908\" alt=\"Mermaid pie chart rendered from data script using VPasCode text to diagram tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a463155bf5dd.png 700w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a463155bf5dd-300x193.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-58ae240 elementor-widget elementor-widget-heading\" data-id=\"58ae240\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Pie Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-77dd126 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"77dd126\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-ishikawa-diagram-syntax-layout-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7838294 elementor-widget elementor-widget-image\" data-id=\"7838294\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"622\" height=\"580\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a477fee16e82.png\" class=\"attachment-large size-large wp-image-913\" alt=\"Mermaid Ishikawa cause and effect diagram created in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a477fee16e82.png 622w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a477fee16e82-300x280.png 300w\" sizes=\"(max-width: 622px) 100vw, 622px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2ecbe5a elementor-widget elementor-widget-heading\" data-id=\"2ecbe5a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Ishikawa Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-0cc3454 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"0cc3454\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-treemap-diagram-syntax-layout-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6fbbd08 elementor-widget elementor-widget-image\" data-id=\"6fbbd08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"996\" height=\"371\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a47819db27af.png\" class=\"attachment-large size-large wp-image-922\" alt=\"Mermaid treemap chart generated from text script using VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a47819db27af.png 996w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a47819db27af-300x112.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a47819db27af-768x286.png 768w\" sizes=\"(max-width: 996px) 100vw, 996px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-be632d4 elementor-widget elementor-widget-heading\" data-id=\"be632d4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Treemap Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-e777e48 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"e777e48\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-sankey-diagram-syntax-configuration-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-02b2631 elementor-widget elementor-widget-image\" data-id=\"02b2631\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"902\" height=\"400\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4ca5751fdca.png\" class=\"attachment-large size-large wp-image-928\" alt=\"Mermaid Sankey flow diagram rendered inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4ca5751fdca.png 902w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4ca5751fdca-300x133.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4ca5751fdca-768x341.png 768w\" sizes=\"(max-width: 902px) 100vw, 902px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-822f713 elementor-widget elementor-widget-heading\" data-id=\"822f713\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sankey Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-93444d3 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"93444d3\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-xy-chart-syntax-configuration-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bcddb8e elementor-widget elementor-widget-image\" data-id=\"bcddb8e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"500\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc07cdd4df.png\" class=\"attachment-large size-large wp-image-932\" alt=\"Mermaid XY line and bar chart created from code in VPasCode text to diagram tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc07cdd4df.png 700w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc07cdd4df-300x214.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1db59fe elementor-widget elementor-widget-heading\" data-id=\"1db59fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">XY Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-5e6abfe e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"5e6abfe\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-kanban-board-syntax-workflow-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2214f01 elementor-widget elementor-widget-image\" data-id=\"2214f01\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"835\" height=\"243\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc1d54bad7.png\" class=\"attachment-large size-large wp-image-936\" alt=\"Mermaid Kanban task board generated using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc1d54bad7.png 835w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc1d54bad7-300x87.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4cc1d54bad7-768x224.png 768w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9606d0c elementor-widget elementor-widget-heading\" data-id=\"9606d0c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Kanban Board<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ee1991c e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"ee1991c\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-wardley-map-syntax-strategy-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cf25c62 elementor-widget elementor-widget-image\" data-id=\"cf25c62\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"605\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de320944ae-1024x605.png\" class=\"attachment-large size-large wp-image-941\" alt=\"Mermaid Wardley strategy map rendered from text in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de320944ae-1024x605.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de320944ae-300x177.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de320944ae-768x454.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de320944ae.png 1100w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ade59fa elementor-widget elementor-widget-heading\" data-id=\"ade59fa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Wardley Map<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-a33482a e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"a33482a\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-event-modeling-syntax-swimlane-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-62b14b5 elementor-widget elementor-widget-image\" data-id=\"62b14b5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"376\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-1024x376.png\" class=\"attachment-large size-large wp-image-948\" alt=\"Mermaid event modeling diagram created using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-1024x376.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-300x110.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-768x282.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-1536x564.png 1536w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de494df174-2048x752.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a0fcebc elementor-widget elementor-widget-heading\" data-id=\"a0fcebc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Event Modeling<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-f3b86e5 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f3b86e5\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-architecture-diagram-syntax-layout-guide\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0b5ca3f elementor-widget elementor-widget-image\" data-id=\"0b5ca3f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"981\" height=\"674\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de9305d5c4.png\" class=\"attachment-large size-large wp-image-955\" alt=\"Mermaid system architecture diagram generated from code in VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de9305d5c4.png 981w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de9305d5c4-300x206.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4de9305d5c4-768x528.png 768w\" sizes=\"(max-width: 981px) 100vw, 981px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-532affe elementor-widget elementor-widget-heading\" data-id=\"532affe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Architecture Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-621cadf e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"621cadf\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-packet-diagram-syntax-layout-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-130ef39 elementor-widget elementor-widget-image\" data-id=\"130ef39\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"156\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deb824d711-1024x156.png\" class=\"attachment-large size-large wp-image-959\" alt=\"Mermaid network packet structure diagram rendered in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deb824d711-1024x156.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deb824d711-300x46.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deb824d711-768x117.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deb824d711.png 1026w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-732e818 elementor-widget elementor-widget-heading\" data-id=\"732e818\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Packet Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-55bb5a0 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"55bb5a0\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-block-diagram-syntax-grid-layout-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8a6d3d7 elementor-widget elementor-widget-image\" data-id=\"8a6d3d7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"838\" height=\"284\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deda7017bf.png\" class=\"attachment-large size-large wp-image-970\" alt=\"Mermaid block diagram created from text script inside VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deda7017bf.png 838w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deda7017bf-300x102.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4deda7017bf-768x260.png 768w\" sizes=\"(max-width: 838px) 100vw, 838px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d32c0cb elementor-widget elementor-widget-heading\" data-id=\"d32c0cb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Block Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-f34d23e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"f34d23e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-requirement-diagram-syntax-traceability-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-285c755 elementor-widget elementor-widget-image\" data-id=\"285c755\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"314\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df0975e489-1024x314.png\" class=\"attachment-large size-large wp-image-978\" alt=\"Mermaid system requirements diagram generated using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df0975e489-1024x314.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df0975e489-300x92.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df0975e489-768x236.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df0975e489.png 1492w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3d2a79e elementor-widget elementor-widget-heading\" data-id=\"3d2a79e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Requirement Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-519dd4b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"519dd4b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-c4-diagram-syntax-architecture-guide\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e764f1d elementor-widget elementor-widget-image\" data-id=\"e764f1d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"506\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6-1024x506.png\" class=\"attachment-large size-large wp-image-983\" alt=\"Mermaid C4 software model diagram rendered in VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6-1024x506.png 1024w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6-300x148.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6-768x380.png 768w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6-1536x759.png 1536w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df3944f3b6.png 1746w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37d3504 elementor-widget elementor-widget-heading\" data-id=\"37d3504\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">C4 Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-2d969d4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"2d969d4\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/mermaid-js-playbook\/mermaid-js-gitgraph-diagram-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3983fff elementor-widget elementor-widget-image\" data-id=\"3983fff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"560\" height=\"278\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df610e5bf8.png\" class=\"attachment-large size-large wp-image-989\" alt=\"Mermaid Git graph branch diagram created from code using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df610e5bf8.png 560w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/img_6a4df610e5bf8-300x149.png 300w\" sizes=\"(max-width: 560px) 100vw, 560px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d1f5a11 elementor-widget elementor-widget-heading\" data-id=\"d1f5a11\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">GitGraph Diagram<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div id=\"e-n-tab-content-390272663\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272663\" data-tab-index=\"3\" style=\"--n-tabs-title-order: 3;\" class=\" elementor-element elementor-element-3590a96 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"3590a96\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-33b71bd e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"33b71bd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-3238b53 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"3238b53\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d97f56 elementor-widget elementor-widget-heading\" data-id=\"1d97f56\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Complex Networks &amp; Directed Graphs (Graphviz)<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7135ef1 elementor-widget elementor-widget-text-editor\" data-id=\"7135ef1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tFor complex relational dependencies and structural hierarchies, VPasCode serves as a precision <b data-path-to-node=\"17,1,0\" data-index-in-node=\"108\">diagram-as-code tool<\/b>. Render high-density organization charts, data flow graphs, and system node maps directly from DOT scripts.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6ffa878 e-grid e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6ffa878\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<a class=\"elementor-element elementor-element-1a0416f e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"1a0416f\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/graphviz-playbook\/graphviz-digraph-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f37d6ce elementor-widget elementor-widget-image\" data-id=\"f37d6ce\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"951\" height=\"122\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905197c994.png\" class=\"attachment-large size-large wp-image-654\" alt=\"Graphviz directed flowchart diagram generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905197c994.png 951w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905197c994-300x38.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905197c994-768x99.png 768w\" sizes=\"(max-width: 951px) 100vw, 951px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d9df2a0 elementor-widget elementor-widget-heading\" data-id=\"d9df2a0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Digraph<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ef1503e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"ef1503e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/graphviz-playbook\/graphviz-graph-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ee0609c elementor-widget elementor-widget-image\" data-id=\"ee0609c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"257\" height=\"245\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a190540cf743.png\" class=\"attachment-large size-large wp-image-656\" alt=\"Graphviz network connectivity chart rendered from code using VPasCode text to diagram engine\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-02b53bf elementor-widget elementor-widget-heading\" data-id=\"02b53bf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Graph<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-353f6fc e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"353f6fc\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/graphviz-playbook\/graphviz-cluster-syntax-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d2e5b8c elementor-widget elementor-widget-image\" data-id=\"d2e5b8c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"613\" height=\"208\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905889f5ff.png\" class=\"attachment-large size-large wp-image-657\" alt=\"Graphviz grouped cluster diagram created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905889f5ff.png 613w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a1905889f5ff-300x102.png 300w\" sizes=\"(max-width: 613px) 100vw, 613px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6202e58 elementor-widget elementor-widget-heading\" data-id=\"6202e58\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Cluster<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div id=\"e-n-tab-content-390272664\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272664\" data-tab-index=\"4\" style=\"--n-tabs-title-order: 4;\" class=\" elementor-element elementor-element-6708a71 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6708a71\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-6cae572 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6cae572\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-9f155c1 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"9f155c1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e001f9 elementor-widget elementor-widget-heading\" data-id=\"9e001f9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Interactive Data Charts &amp; Analytics (ECharts)<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f6c0c8b elementor-widget elementor-widget-text-editor\" data-id=\"f6c0c8b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Beyond software architecture, VPasCode acts as a versatile <b data-path-to-node=\"20,1,0\" data-index-in-node=\"72\">diagram-as-code tool<\/b> for data visualization. Turn raw JSON datasets and text scripts directly into interactive pie charts, bar graphs, and line trends.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a1e07c1 e-grid e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"a1e07c1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<a class=\"elementor-element elementor-element-50f66fe e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"50f66fe\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/column-chart-core-setup-styling-and-layout-guide\">\n\t\t\t\t<div class=\"elementor-element elementor-element-aa2bd56 elementor-widget elementor-widget-image\" data-id=\"aa2bd56\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"791\" height=\"608\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM.png\" class=\"attachment-large size-large wp-image-1173\" alt=\"ECharts column chart generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM.png 791w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM-300x231.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM-768x590.png 768w\" sizes=\"(max-width: 791px) 100vw, 791px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-565a706 elementor-widget elementor-widget-heading\" data-id=\"565a706\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Column Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d1ab0d5 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"d1ab0d5\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/grouped-column-chart-multi-series-data-and-spacing-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2c9d001 elementor-widget elementor-widget-image\" data-id=\"2c9d001\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"778\" height=\"605\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM.png\" class=\"attachment-large size-large wp-image-1174\" alt=\"ECharts grouped column chart rendered from code using VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM.png 778w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM-300x233.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM-768x597.png 768w\" sizes=\"(max-width: 778px) 100vw, 778px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0bd1774 elementor-widget elementor-widget-heading\" data-id=\"0bd1774\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Column Chart (Grouped)<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-6fd199b e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6fd199b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/stacked-column-chart-part-to-whole-composition-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bfc4bd7 elementor-widget elementor-widget-image\" data-id=\"bfc4bd7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"740\" height=\"600\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.43-PM.png\" class=\"attachment-large size-large wp-image-1175\" alt=\"ECharts stacked column chart created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.43-PM.png 740w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.50.43-PM-300x243.png 300w\" sizes=\"(max-width: 740px) 100vw, 740px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f3ce20c elementor-widget elementor-widget-heading\" data-id=\"f3ce20c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Column Chart (Stacked)<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-77ee520 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"77ee520\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/bar-chart-horizontal-layout-and-label-optimization-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b71101d elementor-widget elementor-widget-image\" data-id=\"b71101d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"786\" height=\"608\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM.png\" class=\"attachment-large size-large wp-image-1176\" alt=\"ECharts horizontal bar chart generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM.png 786w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM-300x232.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM-768x594.png 768w\" sizes=\"(max-width: 786px) 100vw, 786px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4c4459d elementor-widget elementor-widget-heading\" data-id=\"4c4459d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Bar Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-74d9cc6 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"74d9cc6\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/grouped-bar-chart-horizontal-multi-series-comparison-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-812f7ea elementor-widget elementor-widget-image\" data-id=\"812f7ea\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"790\" height=\"617\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM.png\" class=\"attachment-large size-large wp-image-1177\" alt=\"ECharts grouped bar chart rendered from data script in VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM.png 790w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM-300x234.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM-768x600.png 768w\" sizes=\"(max-width: 790px) 100vw, 790px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d77c76d elementor-widget elementor-widget-heading\" data-id=\"d77c76d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Bar Chart (Grouped)<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ebc1ca6 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"ebc1ca6\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/stacked-bar-chart-horizontal-part-to-whole-breakdown-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a38032b elementor-widget elementor-widget-image\" data-id=\"a38032b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"770\" height=\"611\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM.png\" class=\"attachment-large size-large wp-image-1178\" alt=\"ECharts stacked bar chart created using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM.png 770w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM-300x238.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM-768x609.png 768w\" sizes=\"(max-width: 770px) 100vw, 770px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ca518db elementor-widget elementor-widget-heading\" data-id=\"ca518db\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Bar Chart (Stacked)<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-3d7d69c e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"3d7d69c\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/line-chart-trend-tracking-and-continuous-data-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f339991 elementor-widget elementor-widget-image\" data-id=\"f339991\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"948\" height=\"732\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM.png\" class=\"attachment-large size-large wp-image-1239\" alt=\"ECharts line trend chart generated from text script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM.png 948w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM-300x232.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM-768x593.png 768w\" sizes=\"(max-width: 948px) 100vw, 948px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dc135fb elementor-widget elementor-widget-heading\" data-id=\"dc135fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Line Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-13ae23e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"13ae23e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/area-chart-volume-trends-and-quantitative-area-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9aa3ef4 elementor-widget elementor-widget-image\" data-id=\"9aa3ef4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"755\" height=\"617\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.54-PM.png\" class=\"attachment-large size-large wp-image-1180\" alt=\"ECharts filled area chart rendered using VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.54-PM.png 755w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.52.54-PM-300x245.png 300w\" sizes=\"(max-width: 755px) 100vw, 755px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-98f38b2 elementor-widget elementor-widget-heading\" data-id=\"98f38b2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Area Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-cb8865d e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"cb8865d\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/stacked-area-chart-cumulative-trends-and-contribution-analysis-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-68ecf38 elementor-widget elementor-widget-image\" data-id=\"68ecf38\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"727\" height=\"598\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.54.04-PM.png\" class=\"attachment-large size-large wp-image-1181\" alt=\"ECharts stacked area chart created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.54.04-PM.png 727w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-4.54.04-PM-300x247.png 300w\" sizes=\"(max-width: 727px) 100vw, 727px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aec9877 elementor-widget elementor-widget-heading\" data-id=\"aec9877\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Area Chart (Stacked)<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-50d2024 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"50d2024\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/pie-chart-proportional-breakdown-and-segment-slicing-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-18b2555 elementor-widget elementor-widget-image\" data-id=\"18b2555\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"694\" height=\"522\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.33-PM.png\" class=\"attachment-large size-large wp-image-1182\" alt=\"ECharts pie chart rendered from data text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.33-PM.png 694w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.33-PM-300x226.png 300w\" sizes=\"(max-width: 694px) 100vw, 694px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e8fdc04 elementor-widget elementor-widget-heading\" data-id=\"e8fdc04\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Pie Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-6690c7d e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"6690c7d\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/doughnut-chart-ring-based-proportions-and-center-metrics-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9b5e3eb elementor-widget elementor-widget-image\" data-id=\"9b5e3eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"732\" height=\"589\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.48-PM.png\" class=\"attachment-large size-large wp-image-1183\" alt=\"ECharts doughnut chart generated using VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.48-PM.png 732w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.00.48-PM-300x241.png 300w\" sizes=\"(max-width: 732px) 100vw, 732px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9299c4e elementor-widget elementor-widget-heading\" data-id=\"9299c4e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Doughnut Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-3815fdd e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"3815fdd\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/sunburst-chart-radial-hierarchy-and-multi-level-ring-breaks-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3590736 elementor-widget elementor-widget-image\" data-id=\"3590736\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"645\" height=\"605\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.01.00-PM.png\" class=\"attachment-large size-large wp-image-1184\" alt=\"ECharts sunburst hierarchy chart created in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.01.00-PM.png 645w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.01.00-PM-300x281.png 300w\" sizes=\"(max-width: 645px) 100vw, 645px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-92e77f4 elementor-widget elementor-widget-heading\" data-id=\"92e77f4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sunburst Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-0ba81a4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"0ba81a4\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/treemap-chart-hierarchical-volumes-and-nested-proportions-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5102785 elementor-widget elementor-widget-image\" data-id=\"5102785\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"601\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM.png\" class=\"attachment-large size-large wp-image-1250\" alt=\"ECharts treemap data chart rendered from text script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM.png 800w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM-300x225.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM-768x577.png 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a056311 elementor-widget elementor-widget-heading\" data-id=\"a056311\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Treemap Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-aa9e3a8 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"aa9e3a8\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/tree-chart-hierarchical-data-and-structural-relationships-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f5ecaeb elementor-widget elementor-widget-image\" data-id=\"f5ecaeb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"905\" height=\"690\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM.png\" class=\"attachment-large size-large wp-image-1241\" alt=\"ECharts structured tree diagram generated using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM.png 905w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM-300x229.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM-768x586.png 768w\" sizes=\"(max-width: 905px) 100vw, 905px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f7c49b5 elementor-widget elementor-widget-heading\" data-id=\"f7c49b5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Tree Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-16a4d7e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"16a4d7e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/sankey-chart-directional-flow-and-volume-transitions-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-320c4a8 elementor-widget elementor-widget-image\" data-id=\"320c4a8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"923\" height=\"732\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM.png\" class=\"attachment-large size-large wp-image-1242\" alt=\"ECharts Sankey flow chart created from text in VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM.png 923w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM-300x238.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM-768x609.png 768w\" sizes=\"(max-width: 923px) 100vw, 923px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0d01b7a elementor-widget elementor-widget-heading\" data-id=\"0d01b7a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sankey Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-306b4f1 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"306b4f1\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/funnel-chart-conversion-stages-and-process-drop-off-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-201a321 elementor-widget elementor-widget-image\" data-id=\"201a321\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"767\" height=\"595\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.02.00-PM.png\" class=\"attachment-large size-large wp-image-1188\" alt=\"ECharts conversion funnel chart rendered in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.02.00-PM.png 767w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.02.00-PM-300x233.png 300w\" sizes=\"(max-width: 767px) 100vw, 767px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a3791c6 elementor-widget elementor-widget-heading\" data-id=\"a3791c6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Funnel Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-36c4022 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"36c4022\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/boxplot-chart-statistical-distribution-and-outlier-spotting-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f501438 elementor-widget elementor-widget-image\" data-id=\"f501438\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"835\" height=\"610\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM.png\" class=\"attachment-large size-large wp-image-1246\" alt=\"ECharts boxplot statistical chart generated using VPasCode text to diagram tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM.png 835w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM-300x219.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM-768x561.png 768w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cd0ca15 elementor-widget elementor-widget-heading\" data-id=\"cd0ca15\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Boxplot Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-4363a70 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"4363a70\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/candlestick-chart-financial-trading-and-price-action-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-03b6c30 elementor-widget elementor-widget-image\" data-id=\"03b6c30\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"712\" height=\"581\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.10.39-PM.png\" class=\"attachment-large size-large wp-image-1205\" alt=\"ECharts stock candlestick chart created from data in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.10.39-PM.png 712w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.10.39-PM-300x245.png 300w\" sizes=\"(max-width: 712px) 100vw, 712px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4306766 elementor-widget elementor-widget-heading\" data-id=\"4306766\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Candlestick Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-2e7c370 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"2e7c370\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/scatter-chart-bivariate-distribution-and-point-clustering-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b469c27 elementor-widget elementor-widget-image\" data-id=\"b469c27\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"760\" height=\"582\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.09.18-PM.png\" class=\"attachment-large size-large wp-image-1204\" alt=\"ECharts scatter plot chart rendered from text in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.09.18-PM.png 760w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.09.18-PM-300x230.png 300w\" sizes=\"(max-width: 760px) 100vw, 760px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-068402d elementor-widget elementor-widget-heading\" data-id=\"068402d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Scatter Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-867669e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"867669e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/parallel-chart-multi-dimensional-data-analysis-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-978c4b5 elementor-widget elementor-widget-image\" data-id=\"978c4b5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"760\" height=\"613\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.03.37-PM.png\" class=\"attachment-large size-large wp-image-1192\" alt=\"ECharts parallel coordinates chart generated using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.03.37-PM.png 760w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.03.37-PM-300x242.png 300w\" sizes=\"(max-width: 760px) 100vw, 760px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0c71bfa elementor-widget elementor-widget-heading\" data-id=\"0c71bfa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Parallel Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ca8e4c9 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"ca8e4c9\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/heatmap-chart-grid-based-density-and-pattern-mapping-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8b3980c elementor-widget elementor-widget-image\" data-id=\"8b3980c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"712\" height=\"542\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.39-PM.png\" class=\"attachment-large size-large wp-image-1230\" alt=\"ECharts grid heatmap chart rendered from code in VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.39-PM.png 712w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.39-PM-300x228.png 300w\" sizes=\"(max-width: 712px) 100vw, 712px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1108605 elementor-widget elementor-widget-heading\" data-id=\"1108605\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Heatmap Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-5e67886 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"5e67886\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/radar-chart-multi-variable-profiles-and-performance-mapping-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c00f7ae elementor-widget elementor-widget-image\" data-id=\"c00f7ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"660\" height=\"508\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.09-PM.png\" class=\"attachment-large size-large wp-image-1229\" alt=\"ECharts radar performance chart created inside VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.09-PM.png 660w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.50.09-PM-300x231.png 300w\" sizes=\"(max-width: 660px) 100vw, 660px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3132d23 elementor-widget elementor-widget-heading\" data-id=\"3132d23\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Radar Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-28315d5 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"28315d5\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/graph-chart-network-topology-and-relationship-mapping-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-14bfc84 elementor-widget elementor-widget-image\" data-id=\"14bfc84\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"650\" height=\"593\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.05.34-PM.png\" class=\"attachment-large size-large wp-image-1195\" alt=\"ECharts network graph chart generated from text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.05.34-PM.png 650w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.05.34-PM-300x274.png 300w\" sizes=\"(max-width: 650px) 100vw, 650px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9b5665f elementor-widget elementor-widget-heading\" data-id=\"9b5665f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Graph Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-28d56ed e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"28d56ed\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/nightingale-chart-polar-rose-proportions-and-radial-cycles-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8247ae5 elementor-widget elementor-widget-image\" data-id=\"8247ae5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"775\" height=\"634\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM.png\" class=\"attachment-large size-large wp-image-1234\" alt=\"ECharts Nightingale rose chart rendered using VPasCode text to diagram engine\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM.png 775w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM-300x245.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM-768x628.png 768w\" sizes=\"(max-width: 775px) 100vw, 775px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e5bac4b elementor-widget elementor-widget-heading\" data-id=\"e5bac4b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Nightingale (Rose) Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-cb8e948 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"cb8e948\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/gauge-chart-single-metric-status-and-threshold-tracking-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8b06594 elementor-widget elementor-widget-image\" data-id=\"8b06594\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"677\" height=\"538\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.04-PM.png\" class=\"attachment-large size-large wp-image-1197\" alt=\"ECharts metric gauge chart created in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.04-PM.png 677w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.04-PM-300x238.png 300w\" sizes=\"(max-width: 677px) 100vw, 677px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-78ac3d8 elementor-widget elementor-widget-heading\" data-id=\"78ac3d8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Gauge Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-1234ad9 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"1234ad9\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/pictorial-bar-chart-custom-shapes-and-vector-graphical-bars-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cb04a8d elementor-widget elementor-widget-image\" data-id=\"cb04a8d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"742\" height=\"624\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.40-PM.png\" class=\"attachment-large size-large wp-image-1199\" alt=\"ECharts pictorial bar chart generated from text script in VPasCode editor\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.40-PM.png 742w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.06.40-PM-300x252.png 300w\" sizes=\"(max-width: 742px) 100vw, 742px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-80d3254 elementor-widget elementor-widget-heading\" data-id=\"80d3254\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Pictorial Bar Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-783274a e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"783274a\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/theme-river-chart-continuous-categorical-flow-and-trend-analysis-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e4ea828 elementor-widget elementor-widget-image\" data-id=\"e4ea828\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"794\" height=\"630\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM.png\" class=\"attachment-large size-large wp-image-1225\" alt=\"ECharts theme river timeline chart rendered using VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM.png 794w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM-300x238.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM-768x609.png 768w\" sizes=\"(max-width: 794px) 100vw, 794px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e49cd1e elementor-widget elementor-widget-heading\" data-id=\"e49cd1e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Theme River Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-579868e e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"579868e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/echarts-playbook\/calendar-chart-time-series-heatmaps-and-daily-activity-tracking-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-acd0b64 elementor-widget elementor-widget-image\" data-id=\"acd0b64\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"794\" height=\"240\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM.png\" class=\"attachment-large size-large wp-image-1201\" alt=\"ECharts calendar heatmap chart created from text data in VPasCode text to diagram platform\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM.png 794w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM-300x91.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM-768x232.png 768w\" sizes=\"(max-width: 794px) 100vw, 794px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7bb53b6 elementor-widget elementor-widget-heading\" data-id=\"7bb53b6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Calendar Chart<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div id=\"e-n-tab-content-390272665\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272665\" data-tab-index=\"5\" style=\"--n-tabs-title-order: 5;\" class=\" elementor-element elementor-element-fb164bd e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"fb164bd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-be6a8ab e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"be6a8ab\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5c8b3d4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"5c8b3d4\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4581600 elementor-widget elementor-widget-heading\" data-id=\"4581600\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Markdown Mind Maps &amp; Brainstorming (Markmap)<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-10a7f24 elementor-widget elementor-widget-text-editor\" data-id=\"10a7f24\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p data-path-to-node=\"1\">Organize your ideas effortlessly without manual shape alignment. VPasCode operates as an intuitive <b data-path-to-node=\"23,1,0\" data-index-in-node=\"112\">diagram-as-code tool<\/b> that converts plain Markdown bullet lists directly into structured, responsive Markmap trees.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c767bee e-grid e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"c767bee\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<a class=\"elementor-element elementor-element-922f7f2 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"922f7f2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4197c3e elementor-widget elementor-widget-image\" data-id=\"4197c3e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"774\" height=\"444\" src=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM.png\" class=\"attachment-large size-large wp-image-1218\" alt=\"Markmap mind map tree generated from Markdown text in VPasCode diagram-as-code tool\" srcset=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM.png 774w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM-300x172.png 300w, https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM-768x441.png 768w\" sizes=\"(max-width: 774px) 100vw, 774px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a4a4b49 elementor-widget elementor-widget-heading\" data-id=\"a4a4b49\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Mind Map<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Supported Diagram Types in VPasCode VPas&#8230;<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"inline_featured_image":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","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":"disabled","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":""}},"footnotes":""},"class_list":["post-991","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Supported Diagrams | VPasCode Text to Diagram Tool<\/title>\n<meta name=\"description\" content=\"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.\" \/>\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\/tw\/diagrams\/\" \/>\n<meta property=\"og:locale\" content=\"zh_TW\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Supported Diagrams | VPasCode Text to Diagram Tool\" \/>\n<meta property=\"og:description\" content=\"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vpascode.com\/tw\/diagrams\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-29T07:38:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u9810\u4f30\u95b1\u8b80\u6642\u9593\" \/>\n\t<meta name=\"twitter:data1\" content=\"31 \u5206\u9418\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/\",\"name\":\"Supported Diagrams | VPasCode Text to Diagram Tool\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\",\"datePublished\":\"2026-07-09T09:42:51+00:00\",\"dateModified\":\"2026-07-29T07:38:23+00:00\",\"description\":\"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/#breadcrumb\"},\"inLanguage\":\"zh-TW\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-TW\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\",\"width\":331,\"height\":187,\"caption\":\"PlantUML use case diagram generated from text in VPasCode diagram-as-code tool\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/diagrams\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Diagrams\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#website\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/\",\"name\":\"VPasCode\",\"description\":\"by Visual Paradigm\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"zh-TW\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#organization\",\"name\":\"VPasCode\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-TW\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"width\":128,\"height\":138,\"caption\":\"VPasCode\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/tw\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Supported Diagrams | VPasCode Text to Diagram Tool","description":"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.","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\/tw\/diagrams\/","og_locale":"zh_TW","og_type":"article","og_title":"Supported Diagrams | VPasCode Text to Diagram Tool","og_description":"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.","og_url":"https:\/\/www.vpascode.com\/tw\/diagrams\/","og_site_name":"VPasCode","article_modified_time":"2026-07-29T07:38:23+00:00","og_image":[{"url":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"\u9810\u4f30\u95b1\u8b80\u6642\u9593":"31 \u5206\u9418"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/","url":"https:\/\/www.vpascode.com\/tw\/diagrams\/","name":"Supported Diagrams | VPasCode Text to Diagram Tool","isPartOf":{"@id":"https:\/\/www.vpascode.com\/tw\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png","datePublished":"2026-07-09T09:42:51+00:00","dateModified":"2026-07-29T07:38:23+00:00","description":"Explore every supported diagram type in VPasCode, your free diagram-as-code tool. Turn simple text to diagram visuals using PlantUML, Mermaid, Graphviz, ECharts, and Markmap.","breadcrumb":{"@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/#breadcrumb"},"inLanguage":"zh-TW","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/tw\/diagrams\/"]}]},{"@type":"ImageObject","inLanguage":"zh-TW","@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/#primaryimage","url":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png","contentUrl":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/05\/img_6a17ca1e45c92.png","width":331,"height":187,"caption":"PlantUML use case diagram generated from text in VPasCode diagram-as-code tool"},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/tw\/diagrams\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/tw\/"},{"@type":"ListItem","position":2,"name":"Diagrams"}]},{"@type":"WebSite","@id":"https:\/\/www.vpascode.com\/tw\/#website","url":"https:\/\/www.vpascode.com\/tw\/","name":"VPasCode","description":"by Visual Paradigm","publisher":{"@id":"https:\/\/www.vpascode.com\/tw\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vpascode.com\/tw\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"zh-TW"},{"@type":"Organization","@id":"https:\/\/www.vpascode.com\/tw\/#organization","name":"VPasCode","url":"https:\/\/www.vpascode.com\/tw\/","logo":{"@type":"ImageObject","inLanguage":"zh-TW","@id":"https:\/\/www.vpascode.com\/tw\/#\/schema\/logo\/image\/","url":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/06\/cropped-vp-online-logo-v1.png","contentUrl":"https:\/\/www.vpascode.com\/tw\/wp-content\/uploads\/sites\/2\/2026\/06\/cropped-vp-online-logo-v1.png","width":128,"height":138,"caption":"VPasCode"},"image":{"@id":"https:\/\/www.vpascode.com\/tw\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/pages\/991","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/comments?post=991"}],"version-history":[{"count":5,"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/pages\/991\/revisions"}],"predecessor-version":[{"id":1606,"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/pages\/991\/revisions\/1606"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/tw\/wp-json\/wp\/v2\/media?parent=991"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}