marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-19 08:16:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

Break out dagre-d3, new label styling

Browse Source
This commit is contained in:
Björn Weström
2015-01-11 16:15:38 +01:00
parent 1b76160a7d
commit 367d620a82
1 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/diagrams/flowchart/flowRenderer.js
View File

@@ -4,7 +4,7 @@
var graph = require('./graphDb'); var graph = require('./graphDb');
var flow = require('./parser/flow'); var flow = require('./parser/flow');
var dot = require('./parser/dot'); var dot = require('./parser/dot');
var dagreD3 = require('dagre-d3'); var dagreD3 = require('./dagre-d3');
/** /**
* Function that adds the vertices found in the graph definition to the graph to be rendered. * Function that adds the vertices found in the graph definition to the graph to be rendered.
* @param vert Object containing the vertices. * @param vert Object containing the vertices.
@@ -58,6 +58,14 @@ exports.addVertices = function (vert, g) {
verticeText = vertice.text; verticeText = vertice.text;
} }
var labelTypeStr = '';
if(equals('html',mermaid_config.labelType)) {
labelTypeStr = 'html';
} else {
verticeText = verticeText.replace(/<br>/g, "\n");
labelTypeStr = 'text';
}
var radious = 0; var radious = 0;
var _shape = ''; var _shape = '';
@@ -83,7 +91,7 @@ exports.addVertices = function (vert, g) {
_shape = 'rect'; _shape = 'rect';
} }
// Add the node // Add the node
g.setNode(vertice.id, {labelType: "html",shape:_shape, label: verticeText, rx: radious, ry: radious, class: classStr, style: style, id:vertice.id}); g.setNode(vertice.id, {labelType: labelTypeStr, shape:_shape, label: verticeText, rx: radious, ry: radious, class: classStr, style: style, id:vertice.id});
}); });
}; };
@@ -125,12 +133,12 @@ exports.addEdges = function (edges, g) {
} }
// Edge with text // Edge with text
else { else {
var edgeText = edge.text.replace(/<br>/g, "\n");
if(typeof edge.style === 'undefined'){ if(typeof edge.style === 'undefined'){
g.setEdge(edge.start, edge.end,{labelType: "html",style: "stroke: #333; stroke-width: 1.5px;fill:none", labelpos:'c', label: '<span style="background:#e8e8e8">'+edge.text+'</span>', arrowheadStyle: "fill: #333", arrowhead: aHead},cnt); g.setEdge(edge.start, edge.end,{labelType: "text", style: "stroke: #333; stroke-width: 1.5px;fill:none", labelpos:'c', label: edgeText, arrowheadStyle: "fill: #333", arrowhead: aHead},cnt);
}else{ }else{
g.setEdge(edge.start, edge.end, { g.setEdge(edge.start, edge.end, {
labelType: "html",style: style, arrowheadStyle: "fill: #333", label: edge.text, arrowhead: aHead labelType: "text",style: style, arrowheadStyle: "fill: #333", label: edgeText, arrowhead: aHead
},cnt); },cnt);
} }
} }
@@ -161,10 +169,12 @@ exports.getClasses = function (text, isDot) {
var classes = graph.getClasses(); var classes = graph.getClasses();
// Add default class if undefined // Add default class if undefined
if(typeof classes.default === 'undefined') { if(typeof(classes.default) === 'undefined') {
classes.default = {id:'default'}; classes.default = {id:'default'};
classes.default.styles = ['fill:#eaeaea','stroke:#666','stroke-width:1.5px']; classes.default.styles = ['fill:#eaeaea','stroke:#666','stroke-width:1.5px'];
} classes.default.nodeLabelStyles = ['fill:#000','stroke:none','font-weight:300','font-family:"Helvetica Neue",Helvetica,Arial,sans-serf','font-size:14px'];
classes.default.edgeLabelStyles = ['fill:#000','stroke:none','font-weight:300','font-family:"Helvetica Neue",Helvetica,Arial,sans-serf','font-size:14px'];
}
return classes; return classes;
}; };