GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-28 07:03:17 +08:00
Code Issues Projects Releases Wiki Activity

#1694 Applying styles from the graph definition for flowcharts

Browse Source
This commit is contained in:
Knut Sveidqvist 2020-09-23 19:51:16 +02:00
parent f856782528
commit ce23316008
4 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
cypress/integration/rendering/flowchart-v2.spec.js
View File

@ -312,6 +312,16 @@ _one --> b
{htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'}
);
});
it('58: handle styling with style expressions', () => {
imgSnapshotTest(
`
flowchart LR
id1(Start)-->id2(Stop)
style id1 fill:#f9f,stroke:#333,stroke-width:4px
style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
`,
{htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'}
);
});
});

12
cypress/integration/rendering/flowchart.spec.js
View File

@ -776,4 +776,16 @@ describe('Flowchart', () => {
expect(svg).to.not.have.attr('style');
});
});
it('58: handle styling with style expressions', () => {
imgSnapshotTest(
`
graph LR
id1(Start)-->id2(Stop)
style id1 fill:#f9f,stroke:#333,stroke-width:4px
style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
`,
{htmlLabels: true, flowchart: {htmlLabels: true}, securityLevel: 'loose'}
);
});
});

1
src/dagre-wrapper/nodes.js
View File

@ -261,6 +261,7 @@ const rect = (parent, node) => {
rect
.attr('class', 'basic label-container')
.attr('style', node.style)
.attr('rx', node.rx)
.attr('ry', node.ry)
.attr('x', -bbox.width / 2 - halfPadding)

5
src/dagre-wrapper/shapes/util.js
View File

@ -15,7 +15,10 @@ export const labelHelper = (parent, node, _classes, isNode) => {
.attr('id', node.domId || node.id);
// Create the label and insert it after the rect
const label = shapeSvg.insert('g').attr('class', 'label');
const label = shapeSvg
.insert('g')
.attr('class', 'label')
.attr('style', node.labelStyle);
const text = label
.node()