{"id":1956,"date":"2026-06-19T16:17:11","date_gmt":"2026-06-19T16:17:11","guid":{"rendered":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/"},"modified":"2026-06-19T16:17:11","modified_gmt":"2026-06-19T16:17:11","slug":"seamlessly-connect-diagrams-to-documentation-with-opendocs-2","status":"publish","type":"post","link":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/","title":{"rendered":"Terhubung secara mulus diagram ke dokumentasi dengan OpenDocs"},"content":{"rendered":"<p>Dokumentasi adalah mitra diam-diam dari arsitektur perangkat lunak\u2014penting namun sering diabaikan. Bahkan diagram yang dirancang dengan cermat sekalipun menjadi usang dalam hitungan minggu, menyebabkan salah komunikasi dan utang teknis. Alur kerja dokumentasi tradisional bergantung pada ekspor manual, tangkapan layar, dan unggahan ulang yang membosankan, yang tak terhindarkan diabaikan saat tenggat waktu mendekat. Hasilnya? Basis pengetahuan yang tidak ada yang percaya.<\/p>\n<p><img fetchpriority=\"high\" alt=\"Diagram-as-code tool sending text to diagram output directly to OpenDocs\" class=\"alignnone\" decoding=\"async\" fetchpriority=\"high\" height=\"768\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/06\/send-diagram-from-vpascode-to-opendocs.jpg\" width=\"1376\"\/><\/p>\n<p>VPasCode menyelesaikan ini dengan berfungsi sebagai alat yang serbaguna<a href=\"\/overview\"><strong>alat diagram sebagai kode<\/strong><\/a>yang terintegrasi langsung dengan Visual Paradigm OpenDocs, menyederhanakan alur kerja teks ke diagram Anda. Integrasi ini mengubah diagram statis menjadi aset dokumentasi hidup yang berkembang seiring sistem Anda.<\/p>\n<h2>Tantangan Dokumentasi<\/h2>\n<p>Pertimbangkan skenario umum: tim Anda membuat diagram kelas UML untuk mendokumentasikan arsitektur mikroservis baru. Diagram tersebut diekspor sebagai PNG dan diunggah ke wiki internal Anda. Dalam beberapa sprint berikutnya, arsitektur berkembang\u2014endpoint baru ditambahkan, ketergantungan berubah, dan layanan direfaktor. Namun, diagram tetap tidak berubah. Dalam hitungan minggu, diagram tersebut bukan hanya ketinggalan zaman; bahkan menyesatkan secara aktif.<\/p>\n<p>Ini dikenal sebagai<strong>\u201cdoc-rot\u201d<\/strong>\u2014penurunan bertahap akurasi dokumentasi seiring waktu. Alur kerja tradisional menciptakan siklus berantai:<\/p>\n<ul>\n<li><strong>Ekspor manual<\/strong> menghabiskan waktu pengembang dan rentan terhadap kesalahan<\/li>\n<li><strong>Mengunggah ulang<\/strong> pada setiap perubahan menjadi pekerjaan membosankan, sehingga pembaruan ditunda<\/li>\n<li><strong>Diagram yang ketinggalan zaman<\/strong> menyebabkan salah komunikasi dan penyimpangan arsitektur<\/li>\n<\/ul>\n<h2>Cara VPasCode Terhubung ke OpenDocs<\/h2>\n<p>Sebagai alat diagram sebagai kode yang intuitif,<strong>VPasCode<\/strong> berfungsi sebagai jembatan kritis antara pembuatan diagram dari teks dan publikasi dokumentasi melalui<strong>Pipeline Visual Paradigm<\/strong>.<\/p>\n<p>Berikut cara kerja alur kerjanya:<\/p>\n<ol>\n<li><strong>Buat Diagram Anda<\/strong>\u2014Buat Diagram Anda\u2014Gunakan alat diagram sebagai kode kami untuk mengonversi teks PlantUML, Mermaid, atau Graphviz menjadi kode diagram dengan cepat di editor VPasCode<a href=\"https:\/\/www.vpascode.com\/\">editor VPasCode<\/a><\/li>\n<li><strong>Kirim ke Pipeline<\/strong>\u2014Ekspor diagram Anda ke Pipeline dengan satu klik<\/li>\n<li><strong>Sisipkan ke OpenDocs<\/strong>\u2014Tempatkan diagram langsung ke halaman dokumen OpenDocs mana pun<\/li>\n<li><strong>Perbarui Secara Langsung<\/strong>\u2014Saat diagram berubah, ganti ke versi terbaru tanpa mengunggah ulang<\/li>\n<\/ol>\n<p id=\"RNJPCii\"><img alt=\"Workflow diagram showing a diagram-as-code tool converting text to diagram and syncing via Pipeline\" class=\"alignnone wp-image-843 size-full\" decoding=\"async\" height=\"387\" sizes=\"(max-width: 801px) 100vw, 801px\" src=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/06\/img_6a356a77f2eb6.png\" srcset=\"https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/06\/img_6a356a77f2eb6.png 801w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/06\/img_6a356a77f2eb6-300x145.png 300w, https:\/\/www.vpascode.com\/wp-content\/uploads\/2026\/06\/img_6a356a77f2eb6-768x371.png 768w\" width=\"801\"\/><\/p>\n<h2>Dari Konsep ke Dokumen dalam Hitungan Detik<\/h2>\n<p>Proses ekspor sangat sederhana dan memakan waktu kurang dari beberapa detik:<\/p>\n<h3>Langkah 1: Ekspor Diagram Anda dari VPasCode<\/h3>\n<p>Begitu Anda <strong>teks ke diagram<\/strong> kode dirender dengan benar di alat diagram sebagai kode kami, gunakan fungsi ekspor untuk mengirimkannya ke <strong>Pipeline OpenDocs<\/strong>.<\/p>\n<h3>Langkah 2: Sisipkan ke Dokumentasi Anda<\/h3>\n<p>Di OpenDocs, buka halaman dokumen yang ingin Anda edit. Klik di tempat Anda ingin diagram muncul, pilih <strong>Pipeline<\/strong> dari bilah alat untuk menampilkan panel Pipeline. Diagram Anda akan menunggu di daftar aset. Klik pada <strong>Sisipkan versi terbaru<\/strong> untuk menambahkan gambar ke dalam dokumen.<\/p>\n<p><img alt=\"OpenDocs interface inserting text to diagram exports from the diagram-as-code tool\" class=\"alignnone\" decoding=\"async\" height=\"766\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/06\/img_6a3125e97d6b9.png\" style=\"max-width: 100%; height: auto; margin: 1.5rem 0;\" width=\"1192\"\/><\/p>\n<h3>Langkah 3: Pertahankan Dokumentasi Tetap Sinkron<\/h3>\n<p>Ketika arsitektur Anda berkembang, memperbarui diagram di dokumen OpenDocs menjadi tanpa hambatan:<\/p>\n<ul>\n<li>Buka diagram sumber di VPasCode dan buat perubahan Anda<\/li>\n<li>Ekspor ulang ke Pipeline<\/li>\n<li>Di OpenDocs, ulangi langkah-langkah sebelumnya untuk mengganti gambar di OpenDocs.<\/li>\n<\/ul>\n<p>Ini menghilangkan beban manual yang menghambat alur kerja dokumentasi tradisional. Tidak ada unduhan, tidak ada konversi file, tidak ada format ulang\u2014hanya satu klik untuk menyegarkan dokumentasi Anda.<\/p>\n<h2>Mengubah Dokumentasi dari Statis menjadi Hidup<\/h2>\n<p>Integrasi antara VPasCode dan OpenDocs secara mendasar mengubah sifat dokumentasi:<\/p>\n<h3>Pengayaan Kontekstual<\/h3>\n<p>Di dalam OpenDocs, diagram menjadi bagian dari ekosistem pengetahuan yang lebih kaya. Tim dapat melengkapi setiap diagram dengan:<\/p>\n<ul>\n<li><strong>Rasionalisasi desain<\/strong>\u2014mengapa pilihan arsitektur tertentu dibuat<\/li>\n<li><strong>Cerita pengguna<\/strong>\u2014menghubungkan implementasi teknis dengan kebutuhan bisnis<\/li>\n<li><strong>Keterbatasan teknis<\/strong>\u2014mendokumentasikan keterbatasan dan asumsi<\/li>\n<li><strong>Sumber daya terkait<\/strong>\u2014menghubungkan ke dokumentasi API dan panduan penempatan<\/li>\n<\/ul>\n<p>Pengkategorian ini mengubah diagram dari benda terisolasi menjadi simpul dalam graf pengetahuan yang terhubung, sehingga membuatnya jauh lebih berharga bagi anggota tim yang tidak terlibat dalam keputusan desain awal.<\/p>\n<h2>Memulai Integrasi<\/h2>\n<p>Untuk memulai menghubungkan diagram VPasCode Anda ke dokumentasi OpenDocs, cukup lakukan:<\/p>\n<ol>\n<li>Buat diagram Anda di editor gratis<a href=\"https:\/\/www.vpascode.com\/\" rel=\"noopener noreferrer\" target=\"_blank\">editor VPasCode<\/a><\/li>\n<li>Ekspor ke Pipeline OpenDocs<\/li>\n<li>Masukkan ke dalam basis pengetahuan OpenDocs Anda<\/li>\n<\/ol>\n<p>Integrasi ini tersedia untuk pengguna Visual Paradigm Professional Edition dan di atasnya dengan pemeliharaan aktif. Ini memberikan alur kerja mulus \u201ckonsep ke dokumen\u201d yang menghilangkan gesekan manual yang telah menghambat para perancang model dan penulis dokumentasi selama bertahun-tahun.<\/p>\n<hr\/>\n<p><em>Berhenti memperlakukan diagram dan dokumentasi sebagai hal yang terpisah. Rasakan alat diagram-as-code yang kuat kami di vpascode.com untuk mengoptimalkan integrasi teks ke diagram Anda dengan OpenDocs dan mengubah dokumentasi arsitektur Anda menjadi aset yang hidup.<\/em><\/p>\n<h3 style=\"margin-top: 0; margin-bottom: 12px; font-size: 20px; color: #0f172a;\">Hubungkan Diagram Anda ke OpenDocs<\/h3>\n<p style=\"margin-bottom: 20px; color: #334155; line-height: 1.6;\">Percepat proses dokumentasi Anda menggunakan alat diagram-as-code modern yang dengan mudah mengubah teks menjadi kode diagram.<\/p>\n<p><a href=\"https:\/\/www.vpascode.com\/\" style=\"display: inline-block; padding: 12px 24px; background-color: #0284c7; color: #ffffff; text-decoration: none; border-radius: 4px; font-weight: 600;\">Mulai Diagram-as-Code Secara Gratis<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dokumentasi adalah mitra diam-diam dari arsitektur perangkat lunak\u2014penting namun sering diabaikan. Bahkan diagram yang dirancang dengan cermat sekalipun menjadi usang dalam hitungan minggu, menyebabkan salah komunikasi dan utang teknis. Alur kerja dokumentasi tradisional bergantung pada ekspor manual, tangkapan layar, dan&#8230;<\/p>\n","protected":false},"author":4,"featured_media":1957,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[18],"tags":[],"class_list":["post-1956","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-features-updates"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Connect Diagrams to Documentation | Text to Diagram with VPasCode<\/title>\n<meta name=\"description\" content=\"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.\" \/>\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\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/\" \/>\n<meta property=\"og:locale\" content=\"id_ID\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Connect Diagrams to Documentation | Text to Diagram with VPasCode\" \/>\n<meta property=\"og:description\" content=\"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"article:published_time\" content=\"2026-06-19T16:17:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"801\" \/>\n\t<meta property=\"og:image:height\" content=\"387\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"jick\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Ditulis oleh\" \/>\n\t<meta name=\"twitter:data1\" content=\"\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimasi waktu membaca\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 menit\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/\"},\"author\":{\"name\":\"jick\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#\\\/schema\\\/person\\\/cd8aa8455bd8bc6827b3efdfa79ad3a6\"},\"headline\":\"Terhubung secara mulus diagram ke dokumentasi dengan OpenDocs\",\"datePublished\":\"2026-06-19T16:17:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/\"},\"wordCount\":701,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/img_6a356a77f2eb6-1.png\",\"articleSection\":[\"Features &amp; Updates\"],\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/\",\"name\":\"Connect Diagrams to Documentation | Text to Diagram with VPasCode\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/img_6a356a77f2eb6-1.png\",\"datePublished\":\"2026-06-19T16:17:11+00:00\",\"description\":\"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#breadcrumb\"},\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/img_6a356a77f2eb6-1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/wp-content\\\/uploads\\\/sites\\\/7\\\/2026\\\/06\\\/img_6a356a77f2eb6-1.png\",\"width\":801,\"height\":387},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Terhubung secara mulus diagram ke dokumentasi dengan OpenDocs\"}]},{\"@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\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/#\\\/schema\\\/person\\\/cd8aa8455bd8bc6827b3efdfa79ad3a6\",\"name\":\"jick\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g\",\"caption\":\"jick\"},\"url\":\"https:\\\/\\\/www.vpascode.com\\\/id\\\/author\\\/jick\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Connect Diagrams to Documentation | Text to Diagram with VPasCode","description":"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.","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\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/","og_locale":"id_ID","og_type":"article","og_title":"Connect Diagrams to Documentation | Text to Diagram with VPasCode","og_description":"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.","og_url":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/","og_site_name":"VPasCode","article_published_time":"2026-06-19T16:17:11+00:00","og_image":[{"width":801,"height":387,"url":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png","type":"image\/png"}],"author":"jick","twitter_card":"summary_large_image","twitter_misc":{"Ditulis oleh":false,"Estimasi waktu membaca":"4 menit"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#article","isPartOf":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/"},"author":{"name":"jick","@id":"https:\/\/www.vpascode.com\/id\/#\/schema\/person\/cd8aa8455bd8bc6827b3efdfa79ad3a6"},"headline":"Terhubung secara mulus diagram ke dokumentasi dengan OpenDocs","datePublished":"2026-06-19T16:17:11+00:00","mainEntityOfPage":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/"},"wordCount":701,"commentCount":0,"publisher":{"@id":"https:\/\/www.vpascode.com\/id\/#organization"},"image":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png","articleSection":["Features &amp; Updates"],"inLanguage":"id","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/","url":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/","name":"Connect Diagrams to Documentation | Text to Diagram with VPasCode","isPartOf":{"@id":"https:\/\/www.vpascode.com\/id\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png","datePublished":"2026-06-19T16:17:11+00:00","description":"Keep system documentation up to date with OpenDocs and VPasCode, an integrated text to diagram and diagram-as-code tool for live previews.","breadcrumb":{"@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#breadcrumb"},"inLanguage":"id","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/"]}]},{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#primaryimage","url":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png","contentUrl":"https:\/\/www.vpascode.com\/id\/wp-content\/uploads\/sites\/7\/2026\/06\/img_6a356a77f2eb6-1.png","width":801,"height":387},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/id\/seamlessly-connect-diagrams-to-documentation-with-opendocs-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/id\/"},{"@type":"ListItem","position":2,"name":"Terhubung secara mulus diagram ke dokumentasi dengan OpenDocs"}]},{"@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\/"}},{"@type":"Person","@id":"https:\/\/www.vpascode.com\/id\/#\/schema\/person\/cd8aa8455bd8bc6827b3efdfa79ad3a6","name":"jick","image":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/secure.gravatar.com\/avatar\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0c89451a99649a6ebefa14a9167db0960c327e8c33ea79fdb68fc38aa18d768a?s=96&d=mm&r=g","caption":"jick"},"url":"https:\/\/www.vpascode.com\/id\/author\/jick\/"}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/posts\/1956","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/comments?post=1956"}],"version-history":[{"count":0,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/posts\/1956\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/media\/1957"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/media?parent=1956"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/categories?post=1956"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vpascode.com\/id\/wp-json\/wp\/v2\/tags?post=1956"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}