来源资料待手动核验
项目简介
Integrate Mermaid Diagrams in SAP GUI Containers
Integrate Mermaid Diagrams in SAP GUI Containers
Integrate Mermaid Diagrams in SAP GUI Containers
Source Code of mermaid release 11.12.0 is included as SMW0 Object (downloaded from https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js)
This is a work in progress, there are bugs. The background color of the HTML container is determined with cl_gui_resources, but this might not work correctly if corrections described in SAP Note 3002961 are not applied in the System. The font color and type are on the todo list (doesn't work yet).
Mermaid does not work in the Internet Explorer Browser Control, so the Edge Chromium Control has to be used. More info in SAP Note 2913405

And SAP GUI version should be from 7.70 or higher.
DATA(diagram) = NEW zcl_wd_gui_mermaid_js_diagram( parent = some_instance_of_cl_gui_container ).
diagram->set_source_code_string( |graph TD\n|
&& |A[Client] --> B[Load Balancer]\n|
&& |B --> C[Server01]\n|
&& |B --> D[Server02]\n| ).
diagram->display( ).

ZWD_MERMAID_SAMPLE_1Simplest possible example, basically the code that is mentioned in the preview section.
ZWD_MERMAID_SAMPLE_2Example in a classic screen, with a couple of different diagrams.

ZWD_MERMAID_TESTUse this to test how a diagram looks in SAP GUI after designing with Mermaid Live Editor. Includes basic error handling (parse errors are displayed in the bottom left corner) and configuration editable as JSON.
