marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-10-28 17:34:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: Add support for adding notes to namespaces in class diagrams

Browse Source
This commit is contained in:
kairi003
2024-09-03 03:54:12 +09:00
parent 2d2add5b44
commit fc0c7936d1
4 changed files with 83 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/mermaid/src/diagrams/class/classDb.ts
View File

@@ -132,7 +132,7 @@ export const getRelations = function (): ClassRelation[] {
export const getNote = function (id: string | number) {
const key = typeof id === 'number' ? `note${id}` : id;
return notes.get(key)!;
}
};
export const getNotes = function () {
return notes;
@@ -458,14 +458,24 @@ const getNamespaces = function (): NamespaceMap {
* @param classNames - Ids of the class to add
* @public
*/
export const addClassesToNamespace = function (id: string, classNames: string[]) {
export const addClassesToNamespace = function (
id: string,
classNames: string[],
noteNames: string[]
) {
if (!namespaces.has(id)) {
return;
}
for (const name of classNames) {
const { className } = splitClassNameAndType(name);
classes.get(className)!.parent = id;
namespaces.get(id)!.classes.set(className, classes.get(className)!);
const classNode = getClass(className);
classNode.parent = id;
namespaces.get(id)!.classes.set(className, classNode);
}
for (const noteName of noteNames) {
const noteNode = getNote(noteName);
noteNode.parent = id;
namespaces.get(id)!.notes.set(noteName, noteNode);
}
};

108
packages/mermaid/src/diagrams/class/classRenderer-v2.ts
View File

@@ -65,6 +65,9 @@ export const addNamespaces = function (
g.setNode(vertex.id, node);
addClasses(vertex.classes, g, _id, diagObj, vertex.id);
const classes: ClassMap = diagObj.db.getClasses();
const relations: ClassRelation[] = diagObj.db.getRelations();
addNotes(vertex.notes, g, relations.length + 1, classes, vertex.id);
log.info('setNode', node);
});
@@ -147,66 +150,71 @@ export const addNotes = function (
notes: ClassNoteMap,
g: graphlib.Graph,
startEdgeId: number,
classes: ClassMap
classes: ClassMap,
parent?: string
) {
log.info(notes);
notes.forEach(function (note, i) {
const vertex = note;
[...notes.values()]
.filter((note) => note.parent === parent)
.forEach(function (vertex) {
const cssNoteStr = '';
const cssNoteStr = '';
const styles = { labelStyle: '', style: '' };
const styles = { labelStyle: '', style: '' };
const vertexText = vertex.text;
const vertexText = vertex.text;
const radius = 0;
const shape = 'note';
const node = {
labelStyle: styles.labelStyle,
shape: shape,
labelText: sanitizeText(vertexText),
noteData: vertex,
rx: radius,
ry: radius,
class: cssNoteStr,
style: styles.style,
id: vertex.id,
domId: vertex.id,
tooltip: '',
type: 'note',
// TODO V10: Flowchart ? Keeping flowchart for backwards compatibility. Remove in next major release
padding: getConfig().flowchart?.padding ?? getConfig().class?.padding,
};
g.setNode(vertex.id, node);
log.info('setNode', node);
const radius = 0;
const shape = 'note';
const node = {
labelStyle: styles.labelStyle,
shape: shape,
labelText: sanitizeText(vertexText),
noteData: vertex,
rx: radius,
ry: radius,
class: cssNoteStr,
style: styles.style,
id: vertex.id,
domId: vertex.id,
tooltip: '',
type: 'note',
// TODO V10: Flowchart ? Keeping flowchart for backwards compatibility. Remove in next major release
padding: getConfig().flowchart?.padding ?? getConfig().class?.padding,
};
g.setNode(vertex.id, node);
log.info('setNode', node);
if (parent) {
g.setParent(vertex.id, parent);
}
if (!vertex.class || !classes.has(vertex.class)) {
return;
}
const edgeId = startEdgeId + i;
if (!vertex.class || !classes.has(vertex.class)) {
return;
}
const edgeId = startEdgeId + vertex.index;
const edgeData: EdgeData = {
id: `edgeNote${edgeId}`,
//Set relationship style and line type
classes: 'relation',
pattern: 'dotted',
// Set link type for rendering
arrowhead: 'none',
//Set edge extra labels
startLabelRight: '',
endLabelLeft: '',
//Set relation arrow types
arrowTypeStart: 'none',
arrowTypeEnd: 'none',
style: 'fill:none',
labelStyle: '',
curve: interpolateToCurve(conf.curve, curveLinear),
};
const edgeData: EdgeData = {
id: `edgeNote${edgeId}`,
//Set relationship style and line type
classes: 'relation',
pattern: 'dotted',
// Set link type for rendering
arrowhead: 'none',
//Set edge extra labels
startLabelRight: '',
endLabelLeft: '',
//Set relation arrow types
arrowTypeStart: 'none',
arrowTypeEnd: 'none',
style: 'fill:none',
labelStyle: '',
curve: interpolateToCurve(conf.curve, curveLinear),
};
// Add the edge to the graph
g.setEdge(vertex.id, vertex.class, edgeData, edgeId);
});
// Add the edge to the graph
g.setEdge(vertex.id, vertex.class, edgeData, edgeId);
});
};
/**

1
packages/mermaid/src/diagrams/class/classTypes.ts
View File

@@ -137,6 +137,7 @@ export interface ClassNote {
class: string;
text: string;
index: number;
parent?: string;
}
export interface ClassRelation {

17
packages/mermaid/src/diagrams/class/parser/classDiagram.jison
View File

@@ -270,8 +270,8 @@ statement
;
namespaceStatement
: namespaceIdentifier STRUCT_START classStatements STRUCT_STOP {yy.addClassesToNamespace($1, $3);}
| namespaceIdentifier STRUCT_START NEWLINE classStatements STRUCT_STOP {yy.addClassesToNamespace($1, $4);}
: namespaceIdentifier STRUCT_START classStatements STRUCT_STOP {yy.addClassesToNamespace($1, $3[0], $3[1]);}
| namespaceIdentifier STRUCT_START NEWLINE classStatements STRUCT_STOP {yy.addClassesToNamespace($1, $4[0], $4[1]);}
;
namespaceIdentifier
@@ -279,9 +279,12 @@ namespaceIdentifier
;
classStatements
: classStatement {$$=[$1]}
| classStatement NEWLINE {$$=[$1]}
| classStatement NEWLINE classStatements {$3.unshift($1); $$=$3}
: classStatement {$$=[[$1], []]}
| classStatement NEWLINE {$$=[[$1], []]}
| classStatement NEWLINE classStatements {$3[0].unshift($1); $$=$3}
| noteStatement {$$=[[], [$1]]}
| noteStatement NEWLINE {$$=[[], [$1]]}
| noteStatement NEWLINE classStatements {$3[1].unshift($1); $$=$3}
;
classStatement
@@ -320,8 +323,8 @@ relationStatement
;
noteStatement
: NOTE_FOR className noteText { yy.addNote($3, $2); }
| NOTE noteText { yy.addNote($2); }
: NOTE_FOR className noteText { $$=yy.addNote($3, $2); }
| NOTE noteText { $$=yy.addNote($2); }
;
direction