diff --git a/cypress/platform/knsv.html b/cypress/platform/knsv.html
index 72df620e6..ba71a135c 100644
--- a/cypress/platform/knsv.html
+++ b/cypress/platform/knsv.html
@@ -95,9 +95,10 @@ mindmap
GrandChild3
GrandChild4
Child4((Child Num 4
with
wrap text))
- GrandChild5[With icon]
- :::(mdi mdi-numeric-8-circle)
- GrandChild6
+ GrandChild5[With
icon
one
two
three]
+ ::icon(mdi mdi-numeric-8-circle)
+ GrandChild6sakdjhfkla jhklasjfh klj
+ ::icon(mdi mdi-numeric-8-circle)
Child1
GrandChild1
sc1
diff --git a/src/diagrams/mindmap/styles.js b/src/diagrams/mindmap/styles.js
index 86d9fe621..1472c44d8 100644
--- a/src/diagrams/mindmap/styles.js
+++ b/src/diagrams/mindmap/styles.js
@@ -21,6 +21,10 @@ const genSections = (options) => {
.section-${i - 1} text {
fill: ${options['gitBranchLabel' + i]};
}
+ .node-icon-${i - 1} {
+ font-size: 40px;
+ color: ${options['gitBranchLabel' + i]};
+ }
.section-edge-${i - 1}{
stroke: ${options['git' + i]};
}
@@ -55,6 +59,12 @@ const getStyles = (options) =>
.section-root text {
fill: ${options.gitBranchLabel0};
}
+ .icon-container {
+ height:100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;A
+ }
`;
export default getStyles;
diff --git a/src/diagrams/mindmap/svgDraw.js b/src/diagrams/mindmap/svgDraw.js
index a4ce77b82..f887fa469 100644
--- a/src/diagrams/mindmap/svgDraw.js
+++ b/src/diagrams/mindmap/svgDraw.js
@@ -128,12 +128,32 @@ export const drawNode = function (elem, node, section, conf) {
const bbox = txt.node().getBBox();
node.height = bbox.height + conf.fontSize * 1.1 * 0.5 + node.padding;
node.width = bbox.width + 2 * node.padding;
-
- // textElem.attr('transform', 'translate(' + node.width / 2 + ', ' + node.height / 2 + ')');
- textElem.attr('transform', 'translate(' + node.width / 2 + ', ' + node.padding / 2 + ')');
- {
- /* */
+ if (node.icon) {
+ node.width += 50;
+ const orgHeight = node.height;
+ node.height = Math.max(orgHeight, 60);
+ const heightDiff = Math.abs(node.height - orgHeight);
+ const icon = nodeElem
+ .append('foreignObject')
+ .attr('width', '60px')
+ .attr('height', node.height)
+ .attr('style', 'text-align: center;margin-top:' + heightDiff / 2 + 'px;');
+ // .attr('x', 0)
+ // .attr('y', 0)
+ // .attr('class', 'node-icon ' + node.icon);
+ icon
+ .append('div')
+ .attr('class', 'icon-container')
+ .append('i')
+ .attr('class', 'node-icon-' + section + ' ' + node.icon);
+ textElem.attr(
+ 'transform',
+ 'translate(' + (25 + node.width / 2) + ', ' + (heightDiff / 2 + node.padding / 2) + ')'
+ );
+ } else {
+ textElem.attr('transform', 'translate(' + node.width / 2 + ', ' + node.padding / 2 + ')');
}
+
switch (node.type) {
case db.nodeType.DEFAULT:
defaultBkg(bkgElem, node, section, conf);