marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-25 10:20:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

#5237 Alternating background

Browse Source
This commit is contained in:
Knut Sveidqvist
2024-05-10 07:43:04 +02:00
parent f480fb7c85
commit 7ecb772c6c
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
cypress/platform/knsv2.html
View File

@@ -73,7 +73,7 @@
</style> </style>
</head> </head>
<body> <body>
<pre id="diagram" class="mermaid"> <pre id="diagram" class="mermaid2">
stateDiagram stateDiagram
NumLockOff --> NumLockOn : EvNumLockPressed NumLockOff --> NumLockOn : EvNumLockPressed
</pre </pre
@@ -113,6 +113,9 @@ stateDiagram-v2
Chimp --> A:One Chimp --> A:One
Chimp --> B:Two Chimp --> B:Two
Chimp --> C:Three Chimp --> C:Three
state InActive {
D
}
} }
} }
</pre </pre

17
packages/mermaid/src/rendering-util/rendering-elements/clusters.js
View File

@@ -178,6 +178,13 @@ const roundedWithTitle = (parent, node) => {
// add the rect // add the rect
let rect; let rect;
if (node.useRough) { if (node.useRough) {
const isAlt = node.classes.indexOf('statediagram-cluster-alt') >= 0;
console.log(
'DAGA node in roundedWithTitle',
node.classes,
node.classes.indexOf('statediagram-cluster-alt'),
isAlt
);
const rc = rough.svg(shapeSvg); const rc = rough.svg(shapeSvg);
const roughOuterNode = const roughOuterNode =
node.rx || node.ry node.rx || node.ry
@@ -187,7 +194,10 @@ const roundedWithTitle = (parent, node) => {
: rc.rectangle(x, y, width, height); : rc.rectangle(x, y, width, height);
rect = shapeSvg.insert(() => roughOuterNode); rect = shapeSvg.insert(() => roughOuterNode);
const roughInnerNode = rc.rectangle(x, innerY, width, innerHeight); const roughInnerNode = rc.rectangle(x, innerY, width, innerHeight, {
fill: isAlt ? 'lightgrey' : 'white',
fillStyle: isAlt ? 'hachure' : 'solid',
});
rect = shapeSvg.insert(() => roughOuterNode); rect = shapeSvg.insert(() => roughOuterNode);
innerRect = shapeSvg.insert(() => roughInnerNode); innerRect = shapeSvg.insert(() => roughInnerNode);
@@ -248,11 +258,8 @@ const divider = (parent, node) => {
if (node.useRough) { if (node.useRough) {
const rc = rough.svg(shapeSvg); const rc = rough.svg(shapeSvg);
const roughNode = rc.rectangle(x, y, width, height, { const roughNode = rc.rectangle(x, y, width, height, {
fill: 'grey', fill: 'lightgrey',
roughness: 0.5, roughness: 0.5,
// bowing: 6,
// stroke: 'green',
// strokeWidth: 3,
strokeLineDash: [5], strokeLineDash: [5],
}); });