{"id":2012,"date":"2026-07-09T09:42:51","date_gmt":"2026-07-09T09:42:51","guid":{"rendered":"https:\/\/www.vpascode.com\/id\/diagrams\/"},"modified":"2026-07-09T09:42:51","modified_gmt":"2026-07-09T09:42:51","slug":"diagrams","status":"publish","type":"page","link":"https:\/\/www.vpascode.com\/id\/diagrams\/","title":{"rendered":"Diagram"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2012\" class=\"elementor elementor-2012\">\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\/editor\/\" 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\tD2\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\tECharts\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272666\" data-tab-title-id=\"e-n-tab-title-390272666\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"6\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272666\" style=\"--n-tabs-title-order: 6;\">\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<button id=\"e-n-tab-title-390272667\" data-tab-title-id=\"e-n-tab-title-390272667\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"7\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272667\" style=\"--n-tabs-title-order: 7;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tData &amp; Schemas\t\t\t<\/span>\n\t\t<\/button>\n\t\t\t\t<button id=\"e-n-tab-title-390272668\" data-tab-title-id=\"e-n-tab-title-390272668\" class=\"e-n-tab-title\" aria-selected=\"false\" data-tab-index=\"8\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-n-tab-content-390272668\" style=\"--n-tabs-title-order: 8;\">\n\t\t\t\t\t\t<span class=\"e-n-tab-title-text\">\n\t\t\t\tCode\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\">Dukungan PlantUML<\/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 di VPasCode memberikan arsitek perangkat lunak alat yang kuat<b data-index-in-node=\"69\" data-path-to-node=\"11,1,0\">alat diagram sebagai kode<\/b>untuk memodelkan sistem yang kompleks. Dengan mudah ubah teks biasa menjadi diagram arsitektur UML kelas, urutan, aktivitas, dan C4.<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a17ca1e45c92.png 331w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kasus Penggunaan<\/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\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kelas<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a18fd5649b30.png 455w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Urutan<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a18fe65178d1.png 480w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Aktivitas<\/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\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Status<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a18ffc981a53.png 470w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Objek<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a19002718bf6.png 472w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Komponen<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a19009dbf8f1.png 362w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Penempatan<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1900e30fbf7.png 554w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Waktu<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a19012676e1c.png 301w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram ERD<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1901b079e3a.png 533w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram ArchiMate<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a19024586a43.png 759w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Model C4<\/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\">Dukungan Mermaid.js<\/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>Dirancang untuk dokumentasi pengembang yang cepat, VPasCode mengintegrasikan Mermaid sebagai alat ringan dan fleksibel<b data-index-in-node=\"111\" data-path-to-node=\"14,1,0\">alat diagram sebagai kode<\/b>. Hasilkan bagan alir, perjalanan pengguna, timeline proyek Gantt, dan graf Git dalam hitungan detik.<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1902d48117d.png 511w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Bagan Alir<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a190321054b5.png 731w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kelas<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1903768417b.png 939w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1903768417b-300x265.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Urutan<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1903d115d5e.png 709w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram ERD<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904232f697-360x1024.png 360w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Status<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a190462044fb.png 729w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Peta Pikiran<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a19049caf4ef.png 584w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Grafik Gantt<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904c8c4a0b.png 500w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904c8c4a0b-300x300.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kuadran<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904e878b33-1024x577.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904e878b33-300x169.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1904e878b33-768x432.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4620ebf38f5-1024x423.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4620ebf38f5-300x124.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4620ebf38f5-768x317.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Perjalanan Pengguna<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4629c718741.png 800w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4629c718741-300x169.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Venn<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a463155bf5dd.png 700w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Lingkaran<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a477fee16e82.png 622w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Ishikawa<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a47819db27af.png 996w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a47819db27af-300x112.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Peta Pohon<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4ca5751fdca.png 902w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4ca5751fdca-300x133.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Sankey<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4cc07cdd4df.png 700w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram XY<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4cc1d54bad7.png 835w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4cc1d54bad7-300x87.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Papan Kanban<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de320944ae-1024x605.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de320944ae-300x177.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de320944ae-768x454.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Peta Wardley<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de494df174-1024x376.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de494df174-300x110.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de494df174-768x282.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de494df174-1536x564.png 1536w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Pemodelan Acara<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de9305d5c4.png 981w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4de9305d5c4-300x206.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Arsitektur<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4deb824d711-1024x156.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4deb824d711-300x46.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4deb824d711-768x117.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Paket<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4deda7017bf.png 838w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4deda7017bf-300x102.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Blok<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df0975e489-1024x314.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df0975e489-300x92.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df0975e489-768x236.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kebutuhan<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df3944f3b6-1024x506.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df3944f3b6-300x148.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df3944f3b6-768x380.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df3944f3b6-1536x759.png 1536w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram C4<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/img_6a4df610e5bf8.png 560w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram GitGraph<\/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\">Jaringan Kompleks &amp; Graf Berarah (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\tUntuk dependensi relasional yang kompleks dan hierarki struktural, VPasCode berfungsi sebagai alat<b data-index-in-node=\"108\" data-path-to-node=\"17,1,0\">alat diagram sebagai kode<\/b>. Render diagram organisasi padat, graf aliran data, dan peta simpul sistem langsung dari skrip DOT.\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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1905197c994.png 951w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1905197c994-300x38.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Digraf<\/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\/id\/wp-content\/uploads\/sites\/7\/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\">Graf<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/05\/img_6a1905889f5ff.png 613w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Kelompok<\/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-7130b0d 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=\"7130b0d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-74f7079 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=\"74f7079\" 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-abbcac7 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=\"abbcac7\" 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-046f9c0 elementor-widget elementor-widget-heading\" data-id=\"046f9c0\" 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\">Dukungan D2<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1318f8c elementor-widget elementor-widget-text-editor\" data-id=\"1318f8c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tD2 di VPasCode memberi tim rekayasa mesin teks ke diagram yang intuitif yang dibuat untuk kejelasan dan kecepatan. Dengan mudah ubah skrip teks sederhana menjadi arsitektur awan yang jelas, model basis data, dan diagram alur kerja CI\/CD.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-13806b0 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=\"13806b0\" 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-e923e95 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=\"e923e95\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/d2-playbook\/d2-diagrams\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5ce35b2 elementor-widget elementor-widget-image\" data-id=\"5ce35b2\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-2.59.34-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-5e574ac elementor-widget elementor-widget-heading\" data-id=\"5e574ac\" 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\">Diagram D2<\/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-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\">Diagram Data Interaktif &amp; Analitik (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>Di luar arsitektur perangkat lunak, VPasCode berfungsi sebagai alat<b data-index-in-node=\"72\" data-path-to-node=\"20,1,0\">alat diagram sebagai kode<\/b>untuk visualisasi data. Ubah dataset JSON mentah dan skrip teks langsung menjadi diagram lingkaran interaktif, grafik batang, dan tren garis.<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM.png 791w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.50.04-PM-300x231.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM.png 778w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.50.23-PM-300x233.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang (Kelompokkan)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.50.43-PM.png 740w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang (Tumpuk)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM.png 786w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.51.20-PM-300x232.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM.png 790w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.51.45-PM-300x234.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang (Kelompokkan)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM.png 770w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.52.04-PM-300x238.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang (Tumpuk)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM.png 948w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.49.42-PM-300x232.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Garis<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.52.54-PM.png 755w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Area<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-4.54.04-PM.png 727w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Area (Tumpuk)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.00.33-PM.png 694w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Lingkaran<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.00.48-PM.png 732w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Donat<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.01.00-PM.png 645w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Matahari<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM.png 800w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.55.32-PM-300x225.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Peta Pohon<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM.png 905w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.51.59-PM-300x229.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Pohon<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM.png 923w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.52.24-PM-300x238.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Sankey<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.02.00-PM.png 767w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Corong<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM.png 835w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-24-at-2.53.29-PM-300x219.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kotak<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.10.39-PM.png 712w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang Lilin<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.09.18-PM.png 760w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Sebar<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.03.37-PM.png 760w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Paralel<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.50.39-PM.png 712w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Peta Panas<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.50.09-PM.png 660w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Radar<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.05.34-PM.png 650w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Graf<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM.png 775w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.52.05-PM-300x245.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Nightingale (Mawar)<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.06.04-PM.png 677w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Pengukur<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.06.40-PM.png 742w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Batang Ilustratif<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM.png 794w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.49.42-PM-300x238.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Sungai Tema<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM.png 794w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.07.12-PM-300x91.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Diagram Kalender<\/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-390272666\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272666\" data-tab-index=\"6\" style=\"--n-tabs-title-order: 6;\" 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\">Peta Pikiran Markdown &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\">Atur ide-ide Anda dengan mudah tanpa harus menyesuaikan bentuk secara manual. VPasCode beroperasi sebagai intuitif<b data-index-in-node=\"112\" data-path-to-node=\"23,1,0\">alat diagram-sebagai-kode<\/b>yang mengonversi daftar bullet Markdown biasa langsung menjadi pohon Markmap yang terstruktur dan responsif.<\/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\/id\/wp-content\/uploads\/sites\/7\/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\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM.png 774w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/07\/Screenshot-2026-07-21-at-5.34.07-PM-300x172.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/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\">Peta Pikiran<\/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-390272667\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272667\" data-tab-index=\"7\" style=\"--n-tabs-title-order: 7;\" class=\" elementor-element elementor-element-4edfa62 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=\"4edfa62\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-196f61c 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=\"196f61c\" 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-7f854d7 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=\"7f854d7\" 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-8020a56 elementor-widget elementor-widget-heading\" data-id=\"8020a56\" 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\">Data dan Skema<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3c77d00 elementor-widget elementor-widget-text-editor\" data-id=\"3c77d00\" 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>Visualisasikan struktur basis data secara instan tanpa pekerjaan tata letak manual. VPasCode berfungsi sebagai alat teks-ke-diagram yang dapat diandalkan yang secara otomatis mengubah daftar teks biasa dan skema menjadi tata letak hubungan entitas yang jelas dan terorganisir.<\/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-862ede0 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=\"862ede0\" 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-5a803d6 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=\"5a803d6\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/sql-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0d5a0d1 elementor-widget elementor-widget-image\" data-id=\"0d5a0d1\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/diagram.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-6822b2d elementor-widget elementor-widget-heading\" data-id=\"6822b2d\" 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\">SQL<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-0ebadec 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=\"0ebadec\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/dbml-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b995adb elementor-widget elementor-widget-image\" data-id=\"b995adb\" 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=\"642\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a35fcf72021e-1-1024x642.png\" class=\"attachment-large size-large wp-image-1949\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a35fcf72021e-1-1024x642.png 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a35fcf72021e-1-300x188.png 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a35fcf72021e-1-768x481.png 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a35fcf72021e-1.png 1264w\" 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-0a0beed elementor-widget elementor-widget-heading\" data-id=\"0a0beed\" 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\">DBML<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-42659f3 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=\"42659f3\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/json-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c3df447 elementor-widget elementor-widget-image\" data-id=\"c3df447\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.33.04-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-5ef0a2a elementor-widget elementor-widget-heading\" data-id=\"5ef0a2a\" 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\">JSON<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-69b2f0e 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=\"69b2f0e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/json-schema-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ea2c5e6 elementor-widget elementor-widget-image\" data-id=\"ea2c5e6\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-editor-enterprise-diagram-complexity-scaling-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1891\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-editor-enterprise-diagram-complexity-scaling-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-editor-enterprise-diagram-complexity-scaling-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-editor-enterprise-diagram-complexity-scaling-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-editor-enterprise-diagram-complexity-scaling-1.jpg 1312w\" 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-eceb82d elementor-widget elementor-widget-heading\" data-id=\"eceb82d\" 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\">Skema JSON<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d390be0 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=\"d390be0\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/jsonc-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-273f205 elementor-widget elementor-widget-image\" data-id=\"273f205\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.32.15-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-5aeecd2 elementor-widget elementor-widget-heading\" data-id=\"5aeecd2\" 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\">JSONC<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-a681ffd 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=\"a681ffd\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/json5-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-57edba9 elementor-widget elementor-widget-image\" data-id=\"57edba9\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/export-plantuml-diagrams-hero-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1893\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/export-plantuml-diagrams-hero-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/export-plantuml-diagrams-hero-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/export-plantuml-diagrams-hero-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/export-plantuml-diagrams-hero-1.jpg 1312w\" 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-985039f elementor-widget elementor-widget-heading\" data-id=\"985039f\" 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\">JSON5<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-9231462 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=\"9231462\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/jsonl-ndjson-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c9b3e38 elementor-widget elementor-widget-image\" data-id=\"c9b3e38\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.33.39-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-c8819b0 elementor-widget elementor-widget-heading\" data-id=\"c8819b0\" 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\">JSONL &amp; NDJSON<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d9f36c2 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=\"d9f36c2\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/toon-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a875ea4 elementor-widget elementor-widget-image\" data-id=\"a875ea4\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-hero-banner-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1895\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-hero-banner-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-hero-banner-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-hero-banner-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-hero-banner-1.jpg 1312w\" 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-d26233a elementor-widget elementor-widget-heading\" data-id=\"d26233a\" 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\">TOON<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-2df83e4 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=\"2df83e4\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/yaml-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-85db523 elementor-widget elementor-widget-image\" data-id=\"85db523\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.34.10-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-f1ab8ee elementor-widget elementor-widget-heading\" data-id=\"f1ab8ee\" 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\">YAML<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-eea7764 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=\"eea7764\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/xml-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3d55410 elementor-widget elementor-widget-image\" data-id=\"3d55410\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-documentation-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1897\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-documentation-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-documentation-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-documentation-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-diagram-as-code-documentation-1.jpg 1312w\" 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-2c1ded5 elementor-widget elementor-widget-heading\" data-id=\"2c1ded5\" 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\">XML<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-a9d7b7d 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=\"a9d7b7d\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/csv-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b4ac412 elementor-widget elementor-widget-image\" data-id=\"b4ac412\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.34.46-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-7cd2d7b elementor-widget elementor-widget-heading\" data-id=\"7cd2d7b\" 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\">CSV<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ec78163 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=\"ec78163\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/data-and-schemas\/toml-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-84fb6f1 elementor-widget elementor-widget-image\" data-id=\"84fb6f1\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.36.05-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-77d9c11 elementor-widget elementor-widget-heading\" data-id=\"77d9c11\" 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\">TOML<\/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-390272668\" role=\"tabpanel\" aria-labelledby=\"e-n-tab-title-390272668\" data-tab-index=\"8\" style=\"--n-tabs-title-order: 8;\" class=\" elementor-element elementor-element-8b00083 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=\"8b00083\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-19e75cc 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=\"19e75cc\" 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-aac9ee1 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=\"aac9ee1\" 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-6c21cff elementor-widget elementor-widget-heading\" data-id=\"6c21cff\" 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\">Kode<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-def485c elementor-widget elementor-widget-text-editor\" data-id=\"def485c\" 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>Peta kan logika perangkat lunak dan struktur proyek secara instan tanpa menggambar manual. VPasCode berfungsi sebagai alat diagram-sebagai-kode yang fleksibel yang secara otomatis mengubah detail dan komponen kode mentah menjadi tata letak arsitektur yang jelas dan terstruktur.<\/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-79a603c 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=\"79a603c\" 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-c08c8b1 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=\"c08c8b1\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/java-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5efa25b elementor-widget elementor-widget-image\" data-id=\"5efa25b\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/sequence-diagram-vs-flowchart-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1901\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/sequence-diagram-vs-flowchart-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/sequence-diagram-vs-flowchart-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/sequence-diagram-vs-flowchart-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/sequence-diagram-vs-flowchart-1.jpg 1312w\" 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-13ddf41 elementor-widget elementor-widget-heading\" data-id=\"13ddf41\" 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\">Java<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-55e879b 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=\"55e879b\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/typescript-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9cd3062 elementor-widget elementor-widget-image\" data-id=\"9cd3062\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.36.46-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-2a60a8a elementor-widget elementor-widget-heading\" data-id=\"2a60a8a\" 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\">TypeScript<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-365d1c3 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=\"365d1c3\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/go-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9417ba6 elementor-widget elementor-widget-image\" data-id=\"9417ba6\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/best-plantuml-editor-vpascode-2026-hero-banner-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1903\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/best-plantuml-editor-vpascode-2026-hero-banner-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/best-plantuml-editor-vpascode-2026-hero-banner-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/best-plantuml-editor-vpascode-2026-hero-banner-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/best-plantuml-editor-vpascode-2026-hero-banner-1.jpg 1312w\" 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-6a6493c elementor-widget elementor-widget-heading\" data-id=\"6a6493c\" 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\">Go<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-ca9da62 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=\"ca9da62\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/rust-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7705856 elementor-widget elementor-widget-image\" data-id=\"7705856\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.37.24-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-81fd9ee elementor-widget elementor-widget-heading\" data-id=\"81fd9ee\" 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\">Rust<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-8ddc6d3 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=\"8ddc6d3\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/csharp-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a622951 elementor-widget elementor-widget-image\" data-id=\"a622951\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-sequence-diagrams-ai-guide-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1905\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-sequence-diagrams-ai-guide-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-sequence-diagrams-ai-guide-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-sequence-diagrams-ai-guide-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-sequence-diagrams-ai-guide-1.jpg 1312w\" 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-83bb3d9 elementor-widget elementor-widget-heading\" data-id=\"83bb3d9\" 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\">C#<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-fec1665 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=\"fec1665\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/python-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-478d45c elementor-widget elementor-widget-image\" data-id=\"478d45c\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.37.54-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-9e75bfe elementor-widget elementor-widget-heading\" data-id=\"9e75bfe\" 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\">Python<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d941336 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=\"d941336\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/c-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a98872a elementor-widget elementor-widget-image\" data-id=\"a98872a\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-vs-diagram-as-code-tools-comparison-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1907\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-vs-diagram-as-code-tools-comparison-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-vs-diagram-as-code-tools-comparison-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-vs-diagram-as-code-tools-comparison-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-vs-diagram-as-code-tools-comparison-1.jpg 1312w\" 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-9210929 elementor-widget elementor-widget-heading\" data-id=\"9210929\" 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\">C<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-cd98af8 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=\"cd98af8\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/cpp-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1ce433d elementor-widget elementor-widget-image\" data-id=\"1ce433d\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.38.20-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-14295b1 elementor-widget elementor-widget-heading\" data-id=\"14295b1\" 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\">C++<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-1be3e67 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=\"1be3e67\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/php-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3091bc0 elementor-widget elementor-widget-image\" data-id=\"3091bc0\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-erd-diagram-as-code-guide-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1909\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-erd-diagram-as-code-guide-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-erd-diagram-as-code-guide-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-erd-diagram-as-code-guide-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/plantuml-erd-diagram-as-code-guide-1.jpg 1312w\" 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-d7fee37 elementor-widget elementor-widget-heading\" data-id=\"d7fee37\" 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\">PHP<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-997803e 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=\"997803e\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/ruby-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ad6209e elementor-widget elementor-widget-image\" data-id=\"ad6209e\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.38.48-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-ea7b5e1 elementor-widget elementor-widget-heading\" data-id=\"ea7b5e1\" 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\">Ruby<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-7afa936 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=\"7afa936\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/scala-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-88f01be elementor-widget elementor-widget-image\" data-id=\"88f01be\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/modern-software-design-with-uml-diagrams-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1911\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/modern-software-design-with-uml-diagrams-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/modern-software-design-with-uml-diagrams-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/modern-software-design-with-uml-diagrams-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/modern-software-design-with-uml-diagrams-1.jpg 1312w\" 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-404309d elementor-widget elementor-widget-heading\" data-id=\"404309d\" 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\">Scala<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-6a53452 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=\"6a53452\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/zig-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e4d9f7b elementor-widget elementor-widget-image\" data-id=\"e4d9f7b\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.39.13-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-a2c3f36 elementor-widget elementor-widget-heading\" data-id=\"a2c3f36\" 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\">Zig<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-d182227 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=\"d182227\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/kotlin-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ec8b582 elementor-widget elementor-widget-image\" data-id=\"ec8b582\" 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=\"637\" src=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/common-uml-diagrams-developer-hero-1-1024x637.jpg\" class=\"attachment-large size-large wp-image-1913\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/common-uml-diagrams-developer-hero-1-1024x637.jpg 1024w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/common-uml-diagrams-developer-hero-1-300x187.jpg 300w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/common-uml-diagrams-developer-hero-1-768x478.jpg 768w, https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/08\/common-uml-diagrams-developer-hero-1.jpg 1312w\" 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-de2d503 elementor-widget elementor-widget-heading\" data-id=\"de2d503\" 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\">Kotlin<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-c28daca 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=\"c28daca\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/swift-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f8d662f elementor-widget elementor-widget-image\" data-id=\"f8d662f\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.39.42-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-f4ba8f0 elementor-widget elementor-widget-heading\" data-id=\"f4ba8f0\" 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\">Swift<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t<a class=\"elementor-element elementor-element-4502dea 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=\"4502dea\" data-element_type=\"container\" data-e-type=\"container\" href=\"https:\/\/www.vpascode.com\/docs\/vpascode-docs\/code\/elixir-visualizer-guide\/\">\n\t\t\t\t<div class=\"elementor-element elementor-element-61d3cc5 elementor-widget elementor-widget-image\" data-id=\"61d3cc5\" 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\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-06-at-1.39.42-PM.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\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-6ec3383 elementor-widget elementor-widget-heading\" data-id=\"6ec3383\" 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\">Elixir<\/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 VPasCode brings PlantUML, Mermaid, Graphviz, ECharts, and Markmap together in one unified workspace. Try our diagram-as-code tool to streamline your architectural documentation. PlantUML Mermaid.js Graphviz D2 ECharts Markmap Data &amp; Schemas Code PlantUML Support PlantUML&#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-2012","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\/id\/diagrams\/\" \/>\n<meta property=\"og:locale\" content=\"id_ID\" \/>\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\/id\/diagrams\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/05\/img_6a17ca1e45c92.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimasi waktu membaca\" \/>\n\t<meta name=\"twitter:data1\" content=\"23 menit\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/\",\"name\":\"Supported Diagrams | VPasCode Text to Diagram Tool\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\",\"datePublished\":\"2026-07-09T09:42:51+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\\\/id\\\/diagrams\\\/#breadcrumb\"},\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/img_6a17ca1e45c92.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/diagrams\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Diagram\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#website\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/\",\"name\":\"VPasCode\",\"description\":\"by Visual Paradigm\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"id\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#organization\",\"name\":\"VPasCode\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"width\":128,\"height\":138,\"caption\":\"VPasCode\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#\\\/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\/id\/diagrams\/","og_locale":"id_ID","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\/id\/diagrams\/","og_site_name":"VPasCode","og_image":[{"url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/05\/img_6a17ca1e45c92.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Estimasi waktu membaca":"23 menit"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/id\/diagrams\/","url":"https:\/\/www.vpascode.com\/id\/diagrams\/","name":"Supported Diagrams | VPasCode Text to Diagram Tool","isPartOf":{"@id":"https:\/\/www.vpascode.com\/id\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/id\/diagrams\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/id\/diagrams\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/05\/img_6a17ca1e45c92.png","datePublished":"2026-07-09T09:42:51+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\/id\/diagrams\/#breadcrumb"},"inLanguage":"id","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/id\/diagrams\/"]}]},{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/www.vpascode.com\/id\/diagrams\/#primaryimage","url":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/05\/img_6a17ca1e45c92.png","contentUrl":"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/05\/img_6a17ca1e45c92.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/id\/diagrams\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/id\/"},{"@type":"ListItem","position":2,"name":"Diagram"}]},{"@type":"WebSite","@id":"https:\/\/www.vpascode.com\/id\/#website","url":"https:\/\/www.vpascode.com\/id\/","name":"VPasCode","description":"by Visual Paradigm","publisher":{"@id":"https:\/\/www.vpascode.com\/id\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vpascode.com\/id\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"id"},{"@type":"Organization","@id":"https:\/\/www.vpascode.com\/id\/#organization","name":"VPasCode","url":"https:\/\/www.vpascode.com\/id\/","logo":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/www.vpascode.com\/id\/#\/schema\/logo\/image\/","url":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/cropped-vp-online-logo-v1.png","contentUrl":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/cropped-vp-online-logo-v1.png","width":128,"height":138,"caption":"VPasCode"},"image":{"@id":"https:\/\/www.vpascode.com\/id\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/pages\/2012","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/comments?post=2012"}],"version-history":[{"count":0,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/pages\/2012\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/media?parent=2012"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}