{"id":8692,"date":"2026-08-27T07:06:08","date_gmt":"2026-08-27T07:06:08","guid":{"rendered":"https:\/\/www.learn-vp.com\/cn\/?page_id=8692"},"modified":"2026-08-27T07:06:20","modified_gmt":"2026-08-27T07:06:20","slug":"plantuml-examples","status":"publish","type":"page","link":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/","title":{"rendered":"PlantUML Examples"},"content":{"rendered":"    <div class=\"vpascode-gallery-container\"\n         id=\"vpascode-gallery-container\"\n         data-gallery-id=\"8673\"\n         data-ajax-url=\"https:\/\/www.learn-vp.com\/cn\/wp-admin\/admin-ajax.php\"\n         data-paged=\"1\"\n         data-batch-size=\"24\"\n         data-max-pages=\"1\"\n         data-total-count=\"1\"\n         style=\"font-family: sans-serif; color: #0f172a;\">\n        <style>\n            .vpascode-filters-bar .vpg-search-box { position: relative !important; }\n            .vpascode-filters-bar .vpg-search-input,\n            #vpascode-search-input {\n                width: 100% !important;\n                height: 38px !important;\n                padding: 7px 32px 7px 34px !important;\n                font-size: 13px !important;\n                line-height: normal !important;\n                color: #1e293b !important;\n                background-color: #ffffff !important;\n                border: 1px solid #cbd5e1 !important;\n                border-radius: 8px !important;\n                box-sizing: border-box !important;\n                outline: none !important;\n                box-shadow: none !important;\n                transition: border-color 0.15s ease, box-shadow 0.15s ease !important;\n            }\n            .vpascode-filters-bar .vpg-search-input:hover,\n            #vpascode-search-input:hover {\n                border-color: #94a3b8 !important;\n            }\n            .vpascode-filters-bar .vpg-search-input:focus,\n            #vpascode-search-input:focus {\n                border-color: #0ea5e9 !important;\n                box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.15) !important;\n            }\n            \/* Explicit Light & Compact Placeholder *\/\n            .vpascode-filters-bar .vpg-search-input::-webkit-input-placeholder,\n            #vpascode-search-input::-webkit-input-placeholder {\n                color: #94a3b8 !important;\n                font-size: 12px !important;\n                font-weight: 400 !important;\n                opacity: 1 !important;\n            }\n            .vpascode-filters-bar .vpg-search-input::-moz-placeholder,\n            #vpascode-search-input::-moz-placeholder {\n                color: #94a3b8 !important;\n                font-size: 12px !important;\n                font-weight: 400 !important;\n                opacity: 1 !important;\n            }\n            .vpascode-filters-bar .vpg-search-input:-ms-input-placeholder,\n            #vpascode-search-input:-ms-input-placeholder {\n                color: #94a3b8 !important;\n                font-size: 12px !important;\n                font-weight: 400 !important;\n                opacity: 1 !important;\n            }\n            .vpascode-filters-bar .vpg-search-input::placeholder,\n            #vpascode-search-input::placeholder {\n                color: #94a3b8 !important;\n                font-size: 12px !important;\n                font-weight: 400 !important;\n                opacity: 1 !important;\n            }\n            .vpascode-filters-bar .vpg-search-icon {\n                position: absolute !important;\n                left: 10px !important;\n                top: 50% !important;\n                transform: translateY(-50%) !important;\n                color: #94a3b8 !important;\n                pointer-events: none !important;\n            }\n            #vpascode-load-more-btn:hover {\n                background: #0284c7 !important;\n                transform: translateY(-1px) !important;\n                box-shadow: 0 4px 12px rgba(14, 165, 233, 0.35) !important;\n            }\n        <\/style>\n        <!-- Filters and Search Bar -->\n        <div class=\"vpascode-filters-bar\" style=\"display: flex; flex-direction: column; gap: 14px; margin-bottom: 24px; background: #f8fafc; padding: 18px; border-radius: 12px; border: 1px solid #e2e8f0; box-shadow: 0 1px 2px rgba(0,0,0,0.04);\">\n            <!-- Row 1: Search and Counter -->\n            <div style=\"display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;\">\n                <!-- Live Search Box -->\n                <div class=\"vpg-search-box vpascode-search-box\" style=\"flex: 1; min-width: 260px; max-width: 440px; position: relative;\">\n                    <svg class=\"vpg-search-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"><\/circle><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line><\/svg>\n                    <input type=\"text\" id=\"vpascode-search-input\" class=\"vpg-search-input\" placeholder=\"Search diagrams, code syntax, keywords...\" value=\"\" autocomplete=\"off\" style=\"width: 100%; height: 38px; padding: 7px 32px 7px 34px; font-size: 13px; color: #1e293b; background: #fff; border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; outline: none;\" \/>\n                    <button type=\"button\" id=\"vpascode-search-clear\" class=\"vpg-search-clear vpg-hidden\" title=\"Clear search\">&times;<\/button>\n                <\/div>\n\n                <!-- Stats Counter & Reset -->\n                <div style=\"display: flex; align-items: center; gap: 14px; margin-left: auto;\">\n                    <div id=\"vpascode-stats-counter\" style=\"font-size: 13px; font-weight: 600; color: #64748b;\">\n                        Showing <span id=\"vpascode-count-visible\" style=\"color: #0284c7; font-weight: 700;\">1<\/span> of <span id=\"vpascode-count-total\">1<\/span> items\n                    <\/div>\n                    <button type=\"button\" id=\"vpascode-reset-btn\" style=\"display: none; background: none; border: none; font-size: 12px; font-weight: 700; color: #ef4444; cursor: pointer; text-decoration: underline; padding: 0;\">\n                        Reset All\n                    <\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Row 2: 4 Taxonomy Filter Dropdowns -->\n            <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px;\">\n                <div>\n                    <label for=\"vp-filter-category\" style=\"display:block; font-size:11px; font-weight:700; color:#475569; margin-bottom:5px; text-transform:uppercase; letter-spacing:0.5px;\">Diagram Type<\/label>\n                    <select id=\"vp-filter-category\" style=\"width:100%; padding:8px 12px; border-radius:8px; border:1px solid #cbd5e1; font-size:13px; background:#fff; color:#0f172a; outline:none; cursor:pointer;\">\n                        <option value=\"\">All Diagram Types<\/option>\n                        <option value=\"use-case-diagram\" data-id=\"55\" >Use Case Diagram<\/option>                    <\/select>\n                <\/div>\n                <div>\n                    <label for=\"vp-filter-notation\" style=\"display:block; font-size:11px; font-weight:700; color:#475569; margin-bottom:5px; text-transform:uppercase; letter-spacing:0.5px;\">Language & Tool<\/label>\n                    <select id=\"vp-filter-notation\" style=\"width:100%; padding:8px 12px; border-radius:8px; border:1px solid #cbd5e1; font-size:13px; background:#fff; color:#0f172a; outline:none; cursor:pointer;\">\n                        <option value=\"\">All Languages & Tools<\/option>\n                        <option value=\"plantuml\" data-id=\"48\" >PlantUML<\/option>                    <\/select>\n                <\/div>\n                <div>\n                    <label for=\"vp-filter-industry\" style=\"display:block; font-size:11px; font-weight:700; color:#475569; margin-bottom:5px; text-transform:uppercase; letter-spacing:0.5px;\">Industry \/ Domain<\/label>\n                    <select id=\"vp-filter-industry\" style=\"width:100%; padding:8px 12px; border-radius:8px; border:1px solid #cbd5e1; font-size:13px; background:#fff; color:#0f172a; outline:none; cursor:pointer;\">\n                        <option value=\"\">All Industries<\/option>\n                        <option value=\"finance\" data-id=\"45\" >Finance<\/option>                    <\/select>\n                <\/div>\n                <div>\n                    <label for=\"vp-filter-complexity\" style=\"display:block; font-size:11px; font-weight:700; color:#475569; margin-bottom:5px; text-transform:uppercase; letter-spacing:0.5px;\">Complexity Level<\/label>\n                    <select id=\"vp-filter-complexity\" style=\"width:100%; padding:8px 12px; border-radius:8px; border:1px solid #cbd5e1; font-size:13px; background:#fff; color:#0f172a; outline:none; cursor:pointer;\">\n                        <option value=\"\">All Complexities<\/option>\n                                            <\/select>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div id=\"vpascode-grid\" style=\"display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px;\">\n                    <div class=\"vpascode-item-card\"\n             data-post-id=\"8706\"\n             data-category-ids=\"55\"\n             data-category-slugs=\"use-case-diagram\"\n             data-notation-ids=\"48\"\n             data-notation-slugs=\"plantuml\"\n             data-industry-ids=\"45\"\n             data-industry-slugs=\"finance\"\n             data-complexity-ids=\"\"\n             data-complexity-slugs=\"\"\n             data-search-text=\"designing an atm system use case diagram with plantuml master the art of modeling banking workflows. this tutorial walks you through creating a comprehensive atm system use case diagram using plantuml and vpascode. use case diagram use-case-diagram plantuml plantuml finance finance   @startuml\r\n!include https:\/\/static.visual-paradigm.com\/web\/resources\/plantuml-stdlib\/themes\/vp.puml\r\n\r\nleft to right direction\r\nskinparam packagestyle rectangle\r\n\r\ntitle atm system use case diagram\r\n\r\nactor customer\r\nactor bankteller\r\nactor administrator\r\n\r\nrectangle &quot;atm system&quot; {\r\n  usecase &quot;withd\"\n             style=\"background:#fff; border:1px solid #e2e8f0; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 1px 3px rgba(0,0,0,0.05); transition:transform 0.2s ease, box-shadow 0.2s ease;\">\n            <div class=\"vpascode-card-media-wrapper\" data-full-img=\"https:\/\/www.learn-vp.com\/cn\/wp-content\/uploads\/sites\/3\/2026\/08\/diagram-job-1787813980424-1.svg\" data-editor-url=\"https:\/\/www.vpascode.com\/editor\/#plantuml:JTQwc3RhcnR1bWwlMEEhaW5jbHVkZSUyMGh0dHBzJTNBJTJGJTJGc3RhdGljLnZpc3VhbC1wYXJhZGlnbS5jb20lMkZ3ZWIlMkZyZXNvdXJjZXMlMkZwbGFudHVtbC1zdGRsaWIlMkZ0aGVtZXMlMkZ2cC5wdW1sJTBBJTBBbGVmdCUyMHRvJTIwcmlnaHQlMjBkaXJlY3Rpb24lMEFza2lucGFyYW0lMjBwYWNrYWdlU3R5bGUlMjByZWN0YW5nbGUlMEElMEF0aXRsZSUyMEFUTSUyMFN5c3RlbSUyMFVzZSUyMENhc2UlMjBEaWFncmFtJTBBJTBBYWN0b3IlMjBDdXN0b21lciUwQWFjdG9yJTIwQmFua1RlbGxlciUwQWFjdG9yJTIwQWRtaW5pc3RyYXRvciUwQSUwQXJlY3RhbmdsZSUyMCUyMkFUTSUyMFN5c3RlbSUyMiUyMCU3QiUwQSUyMCUyMHVzZWNhc2UlMjAlMjJXaXRoZHJhdyUyMENhc2glMjIlMjBhcyUyMFVDMSUwQSUyMCUyMHVzZWNhc2UlMjAlMjJEZXBvc2l0JTIwQ2FzaCUyMiUyMGFzJTIwVUMyJTBBJTIwJTIwdXNlY2FzZSUyMCUyMkNoZWNrJTIwQmFsYW5jZSUyMiUyMGFzJTIwVUMzJTBBJTIwJTIwdXNlY2FzZSUyMCUyMlRyYW5zZmVyJTIwRnVuZHMlMjIlMjBhcyUyMFVDNCUwQSUyMCUyMHVzZWNhc2UlMjAlMjJQcmludCUyMFN0YXRlbWVudCUyMiUyMGFzJTIwVUM1JTBBJTIwJTIwdXNlY2FzZSUyMCUyMkNoYW5nZSUyMFBJTiUyMiUyMGFzJTIwVUM2JTBBJTIwJTIwdXNlY2FzZSUyMCUyMkxvY2slMjBBY2NvdW50JTIyJTIwYXMlMjBVQzclMEElMjAlMjB1c2VjYXNlJTIwJTIyTWFuYWdlJTIwQ2FyZHMlMjIlMjBhcyUyMFVDOCUwQSUyMCUyMHVzZWNhc2UlMjAlMjJTeXN0ZW0lMjBNYWludGVuYW5jZSUyMiUyMGFzJTIwVUM5JTBBJTdEJTBBJTBBQ3VzdG9tZXIlMjAtLSUzRSUyMFVDMSUwQUN1c3RvbWVyJTIwLS0lM0UlMjBVQzIlMEFDdXN0b21lciUyMC0tJTNFJTIwVUMzJTBBQ3VzdG9tZXIlMjAtLSUzRSUyMFVDNCUwQUN1c3RvbWVyJTIwLS0lM0UlMjBVQzUlMEFDdXN0b21lciUyMC0tJTNFJTIwVUM2JTBBJTBBQmFua1RlbGxlciUyMC0tJTNFJTIwVUM3JTBBQmFua1RlbGxlciUyMC0tJTNFJTIwVUM4JTBBJTBBQWRtaW5pc3RyYXRvciUyMC0tJTNFJTIwVUM5JTBBQWRtaW5pc3RyYXRvciUyMC0tJTNFJTIwVUM4JTBBJTBBJTBBJTQwZW5kdW1s\" data-post-url=\"https:\/\/www.learn-vp.com\/cn\/vpascode\/atm-system-use-case-diagram-plantuml-guide\/\" style=\"height:320px; min-height:280px; background:#f8fafc; overflow:hidden; display:flex; align-items:center; justify-content:center; border-bottom:1px solid #e2e8f0; cursor:zoom-in; position:relative;\">\n                <img src=\"https:\/\/www.learn-vp.com\/cn\/wp-content\/uploads\/sites\/3\/2026\/08\/diagram-job-1787813980424-1.svg\" alt=\"Designing an ATM System Use Case Diagram with PlantUML\" class=\"vpascode-gallery-img\" loading=\"lazy\" decoding=\"async\" style=\"max-width:100%; max-height:100%; object-fit:contain; transition:transform 0.2s ease;\" \/>\n            <\/div>\n            <div style=\"padding:16px; display:flex; flex-direction:column; flex-grow:1;\">\n                <h4 style=\"margin:0 0 8px 0; font-size:16px; font-weight:700;\"><a href=\"https:\/\/www.learn-vp.com\/cn\/vpascode\/atm-system-use-case-diagram-plantuml-guide\/\" style=\"color:#0f172a; text-decoration:none;\">Designing an ATM System Use Case Diagram with PlantUML<\/a><\/h4>\n                <p style=\"margin:0 0 12px 0; font-size:13px; color:#64748b; line-height:1.4; flex-grow:1;\">Master the art of modeling banking workflows. This tutorial walks you through creating a comprehensive ATM System Use Case diagram using PlantUML and VPasCode.<\/p>\n                <div style=\"margin-top:auto; padding-top:8px;\">\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:JTQwc3RhcnR1bWwlMEEhaW5jbHVkZSUyMGh0dHBzJTNBJTJGJTJGc3RhdGljLnZpc3VhbC1wYXJhZGlnbS5jb20lMkZ3ZWIlMkZyZXNvdXJjZXMlMkZwbGFudHVtbC1zdGRsaWIlMkZ0aGVtZXMlMkZ2cC5wdW1sJTBBJTBBbGVmdCUyMHRvJTIwcmlnaHQlMjBkaXJlY3Rpb24lMEFza2lucGFyYW0lMjBwYWNrYWdlU3R5bGUlMjByZWN0YW5nbGUlMEElMEF0aXRsZSUyMEFUTSUyMFN5c3RlbSUyMFVzZSUyMENhc2UlMjBEaWFncmFtJTBBJTBBYWN0b3IlMjBDdXN0b21lciUwQWFjdG9yJTIwQmFua1RlbGxlciUwQWFjdG9yJTIwQWRtaW5pc3RyYXRvciUwQSUwQXJlY3RhbmdsZSUyMCUyMkFUTSUyMFN5c3RlbSUyMiUyMCU3QiUwQSUyMCUyMHVzZWNhc2UlMjAlMjJXaXRoZHJhdyUyMENhc2glMjIlMjBhcyUyMFVDMSUwQSUyMCUyMHVzZWNhc2UlMjAlMjJEZXBvc2l0JTIwQ2FzaCUyMiUyMGFzJTIwVUMyJTBBJTIwJTIwdXNlY2FzZSUyMCUyMkNoZWNrJTIwQmFsYW5jZSUyMiUyMGFzJTIwVUMzJTBBJTIwJTIwdXNlY2FzZSUyMCUyMlRyYW5zZmVyJTIwRnVuZHMlMjIlMjBhcyUyMFVDNCUwQSUyMCUyMHVzZWNhc2UlMjAlMjJQcmludCUyMFN0YXRlbWVudCUyMiUyMGFzJTIwVUM1JTBBJTIwJTIwdXNlY2FzZSUyMCUyMkNoYW5nZSUyMFBJTiUyMiUyMGFzJTIwVUM2JTBBJTIwJTIwdXNlY2FzZSUyMCUyMkxvY2slMjBBY2NvdW50JTIyJTIwYXMlMjBVQzclMEElMjAlMjB1c2VjYXNlJTIwJTIyTWFuYWdlJTIwQ2FyZHMlMjIlMjBhcyUyMFVDOCUwQSUyMCUyMHVzZWNhc2UlMjAlMjJTeXN0ZW0lMjBNYWludGVuYW5jZSUyMiUyMGFzJTIwVUM5JTBBJTdEJTBBJTBBQ3VzdG9tZXIlMjAtLSUzRSUyMFVDMSUwQUN1c3RvbWVyJTIwLS0lM0UlMjBVQzIlMEFDdXN0b21lciUyMC0tJTNFJTIwVUMzJTBBQ3VzdG9tZXIlMjAtLSUzRSUyMFVDNCUwQUN1c3RvbWVyJTIwLS0lM0UlMjBVQzUlMEFDdXN0b21lciUyMC0tJTNFJTIwVUM2JTBBJTBBQmFua1RlbGxlciUyMC0tJTNFJTIwVUM3JTBBQmFua1RlbGxlciUyMC0tJTNFJTIwVUM4JTBBJTBBQWRtaW5pc3RyYXRvciUyMC0tJTNFJTIwVUM5JTBBQWRtaW5pc3RyYXRvciUyMC0tJTNFJTIwVUM4JTBBJTBBJTBBJTQwZW5kdW1s\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"vpascode-open-editor-btn\" style=\"display:flex; align-items:center; justify-content:center; gap:6px; width:100%; text-align:center; background:#0ea5e9; color:#fff; padding:8px 14px; border-radius:6px; font-size:12px; font-weight:600; text-decoration:none; box-sizing:border-box; transition:background-color 0.2s;\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6\"><\/path><polyline points=\"15 3 21 3 21 9\"><\/polyline><line x1=\"10\" y1=\"14\" x2=\"21\" y2=\"3\"><\/line><\/svg>\n                        <span>Open Editor<\/span>\n                    <\/a>\n                <\/div>\n                            <\/div>\n        <\/div>\n                <\/div>\n\n        <!-- Progressive \/ Load More Trigger -->\n        <div id=\"vpascode-load-more-wrap\" style=\"text-align: center; margin-top: 32px; margin-bottom: 24px; display: none;\">\n            <button type=\"button\" id=\"vpascode-load-more-btn\" style=\"background: #0ea5e9; color: #ffffff; border: none; padding: 11px 28px; border-radius: 8px; font-size: 13px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 2px 6px rgba(14,165,233,0.25); transition: all 0.2s ease;\">\n                <svg id=\"vpascode-load-chevron\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"6 9 12 15 18 9\"><\/polyline><\/svg>\n                <span id=\"vpascode-load-more-text\">Load More Diagrams<\/span>\n                <span id=\"vpascode-load-more-count\" style=\"background: rgba(255,255,255,0.22); padding: 2px 8px; border-radius: 9999px; font-size: 11px; font-weight: 600;\"><\/span>\n            <\/button>\n        <\/div>\n\n        <!-- SEO Crawlable Pagination (Accessible to Googlebot, progressively enhanced by JS) -->\n        <div class=\"vpascode-seo-pagination\" style=\"display: none;\" aria-hidden=\"true\">\n                    <\/div>\n        <noscript>\n            <div class=\"vpascode-noscript-pagination\" style=\"text-align: center; margin-top: 24px;\">\n                            <\/div>\n        <\/noscript>\n    <\/div>\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","inline_featured_image":false,"site-sidebar-layout":"default","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":"","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":""}},"source_url":"","source_h1_title":"","fifu_image_url":"","fifu_image_alt":"","_fifu_image_alt":"","fifu_alt":"","_fifu_alt":"","fifu_image_title":"","_fifu_image_title":"","fifu_input_alt":"","vp_image_hash":"","footnotes":""},"class_list":["post-8692","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>PlantUML Examples - Learn VP<\/title>\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.learn-vp.com\/cn\/plantuml-examples\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"PlantUML Examples - Learn VP\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/\" \/>\n<meta property=\"og:site_name\" content=\"Learn VP\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-27T07:06:20+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/plantuml-examples\\\/\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/plantuml-examples\\\/\",\"name\":\"PlantUML Examples - Learn VP\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#website\"},\"datePublished\":\"2026-08-27T07:06:08+00:00\",\"dateModified\":\"2026-08-27T07:06:20+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/plantuml-examples\\\/#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/plantuml-examples\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/plantuml-examples\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"PlantUML Examples\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#website\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/\",\"name\":\"Learn VP\",\"description\":\"Learn VP\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#organization\",\"name\":\"Learn VP\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/wp-content\\\/uploads\\\/sites\\\/3\\\/2026\\\/08\\\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png\",\"contentUrl\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/wp-content\\\/uploads\\\/sites\\\/3\\\/2026\\\/08\\\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png\",\"width\":463,\"height\":404,\"caption\":\"Learn VP\"},\"image\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/cn\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"PlantUML Examples - Learn VP","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.learn-vp.com\/cn\/plantuml-examples\/","og_locale":"zh_CN","og_type":"article","og_title":"PlantUML Examples - Learn VP","og_url":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/","og_site_name":"Learn VP","article_modified_time":"2026-08-27T07:06:20+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/","url":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/","name":"PlantUML Examples - Learn VP","isPartOf":{"@id":"https:\/\/www.learn-vp.com\/cn\/#website"},"datePublished":"2026-08-27T07:06:08+00:00","dateModified":"2026-08-27T07:06:20+00:00","breadcrumb":{"@id":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.learn-vp.com\/cn\/plantuml-examples\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.learn-vp.com\/cn\/"},{"@type":"ListItem","position":2,"name":"PlantUML Examples"}]},{"@type":"WebSite","@id":"https:\/\/www.learn-vp.com\/cn\/#website","url":"https:\/\/www.learn-vp.com\/cn\/","name":"Learn VP","description":"Learn VP","publisher":{"@id":"https:\/\/www.learn-vp.com\/cn\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.learn-vp.com\/cn\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"zh-Hans"},{"@type":"Organization","@id":"https:\/\/www.learn-vp.com\/cn\/#organization","name":"Learn VP","url":"https:\/\/www.learn-vp.com\/cn\/","logo":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.learn-vp.com\/cn\/#\/schema\/logo\/image\/","url":"https:\/\/www.learn-vp.com\/cn\/wp-content\/uploads\/sites\/3\/2026\/08\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png","contentUrl":"https:\/\/www.learn-vp.com\/cn\/wp-content\/uploads\/sites\/3\/2026\/08\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png","width":463,"height":404,"caption":"Learn VP"},"image":{"@id":"https:\/\/www.learn-vp.com\/cn\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/pages\/8692","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/comments?post=8692"}],"version-history":[{"count":3,"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/pages\/8692\/revisions"}],"predecessor-version":[{"id":8695,"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/pages\/8692\/revisions\/8695"}],"wp:attachment":[{"href":"https:\/\/www.learn-vp.com\/cn\/wp-json\/wp\/v2\/media?parent=8692"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}