mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-09-18 23:09:49 +02:00
Fix for defect #161, nested subgraphs.
This commit is contained in:
@@ -229,6 +229,7 @@ exports.getClasses = function (text, isDot) {
|
||||
* @param id
|
||||
*/
|
||||
exports.draw = function (text, id,isDot) {
|
||||
|
||||
var parser;
|
||||
graph.clear();
|
||||
if(isDot){
|
||||
@@ -270,35 +271,32 @@ exports.draw = function (text, id,isDot) {
|
||||
return {};
|
||||
});
|
||||
|
||||
var subG;
|
||||
var subGraphs = graph.getSubGraphs();
|
||||
var i = 0;
|
||||
subGraphs.forEach(function(subG){
|
||||
i = i + 1;
|
||||
var id = 'subG'+i;
|
||||
graph.addVertex(id,undefined,undefined,undefined);
|
||||
});
|
||||
for(i=subGraphs.length-1;i>=0;i--){
|
||||
subG = subGraphs[i];
|
||||
graph.addVertex(subG.id,undefined,undefined,undefined);
|
||||
}
|
||||
|
||||
// Fetch the verices/nodes and edges/links from the parsed graph definition
|
||||
var vert = graph.getVertices();
|
||||
|
||||
//console.log(vert);
|
||||
var edges = graph.getEdges();
|
||||
//g.setParent("A", "p");
|
||||
//g.setParent("B", "p");
|
||||
|
||||
//console.log(subGraphs);
|
||||
i = 0;
|
||||
subGraphs.forEach(function(subG){
|
||||
i = i + 1;
|
||||
var id = 'subG'+i;
|
||||
var j;
|
||||
for(i=subGraphs.length-1;i>=0;i--){
|
||||
subG = subGraphs[i];
|
||||
|
||||
d3.selectAll('cluster').append('text');
|
||||
|
||||
subG.nodes.forEach(function(node){
|
||||
//console.log('Setting node',node,' to subgraph '+id);
|
||||
g.setParent(node,id);
|
||||
});
|
||||
});
|
||||
for(j=0;j<subG.nodes.length;j++){
|
||||
//console.log('Setting node',subG.nodes[j],' to subgraph '+id);
|
||||
g.setParent(subG.nodes[j],subG.id);
|
||||
}
|
||||
}
|
||||
exports.addVertices(vert, g);
|
||||
exports.addEdges(edges, g);
|
||||
|
||||
@@ -422,28 +420,35 @@ exports.draw = function (text, id,isDot) {
|
||||
|
||||
setTimeout(function(){
|
||||
var i = 0;
|
||||
subGraphs.forEach(function(subG){
|
||||
//subGraphs.forEach(function(subG) {
|
||||
for(i=0;i<subGraphs.length;i++){
|
||||
subG = subGraphs[i];
|
||||
|
||||
var clusterRects = document.querySelectorAll('#' + id + ' .clusters rect');
|
||||
var clusters = document.querySelectorAll('#' + id + ' .cluster');
|
||||
var clusters = document.querySelectorAll('#' + id + ' .cluster');
|
||||
|
||||
|
||||
if(subG.title !== 'undefined'){
|
||||
if (subG.title !== 'undefined') {
|
||||
var xPos = clusterRects[i].x.baseVal.value;
|
||||
var yPos = clusterRects[i].y.baseVal.value;
|
||||
var width = clusterRects[i].width.baseVal.value;
|
||||
var cluster = d3.select(clusters[i]);
|
||||
var te = cluster.append('text');
|
||||
te.attr('x', xPos+width/2);
|
||||
te.attr('y', yPos +14);
|
||||
te.attr('x', xPos + width / 2);
|
||||
te.attr('y', yPos + 14);
|
||||
te.attr('fill', 'black');
|
||||
te.attr('stroke','none');
|
||||
te.attr('id', id+'Text');
|
||||
te.attr('stroke', 'none');
|
||||
te.attr('id', id + 'Text');
|
||||
te.style('text-anchor', 'middle');
|
||||
te.text(subG.title);
|
||||
if(typeof subGraphs[subGraphs.length-i-1] === 'undefined'){
|
||||
te.text('Undef');
|
||||
}else{
|
||||
te.text(subGraphs[subGraphs.length-i-1].title);
|
||||
}
|
||||
}
|
||||
i = i + 1;
|
||||
});
|
||||
}
|
||||
// i = i + 1;
|
||||
//});
|
||||
},20);
|
||||
};
|
||||
|
||||
|
@@ -6,6 +6,7 @@ var vertices = {};
|
||||
var edges = [];
|
||||
var classes = [];
|
||||
var subGraphs = [];
|
||||
var subCount=0;
|
||||
var direction;
|
||||
// Functions to be run after graph rendering
|
||||
var funs = [];
|
||||
@@ -205,6 +206,7 @@ exports.clear = function () {
|
||||
edges = [];
|
||||
funs = [];
|
||||
subGraphs = [];
|
||||
subCount = 0;
|
||||
};
|
||||
/**
|
||||
*
|
||||
@@ -233,11 +235,16 @@ exports.addSubGraph = function (list, title) {
|
||||
});
|
||||
}
|
||||
|
||||
var subG = [];
|
||||
var nodeList = [];
|
||||
|
||||
subG = uniq(subG.concat.apply(subG,list));
|
||||
nodeList = uniq(nodeList.concat.apply(nodeList,list));
|
||||
|
||||
subGraphs.push({nodes:subG,title:title});
|
||||
|
||||
var subGraph = {id:'subGraph'+subCount, nodes:nodeList,title:title};
|
||||
|
||||
subGraphs.push(subGraph);
|
||||
subCount = subCount + 1;
|
||||
return subGraph.id;
|
||||
};
|
||||
exports.getSubGraphs = function (list) {
|
||||
return subGraphs;
|
||||
|
@@ -217,9 +217,9 @@ statement
|
||||
| clickStatement separator
|
||||
{$$=[];}
|
||||
| subgraph text separator document end
|
||||
{yy.addSubGraph($4,$2);}
|
||||
{$$=yy.addSubGraph($4,$2);}
|
||||
| subgraph separator document end
|
||||
{yy.addSubGraph($3,undefined);}
|
||||
{$$=yy.addSubGraph($3,undefined);}
|
||||
;
|
||||
|
||||
separator: NEWLINE | SEMI | EOF ;
|
||||
|
@@ -118,10 +118,10 @@ case 31: case 32: case 33: case 34: case 35:
|
||||
this.$=[];
|
||||
break;
|
||||
case 36:
|
||||
yy.addSubGraph($$[$0-1],$$[$0-3]);
|
||||
this.$=yy.addSubGraph($$[$0-1],$$[$0-3]);
|
||||
break;
|
||||
case 37:
|
||||
yy.addSubGraph($$[$0-1],undefined);
|
||||
this.$=yy.addSubGraph($$[$0-1],undefined);
|
||||
break;
|
||||
case 41:
|
||||
yy.addLink($$[$0-2],$$[$0],$$[$0-1]);this.$ = [$$[$0-2],$$[$0]];
|
||||
|
@@ -363,6 +363,7 @@ describe('when parsing ',function(){
|
||||
'subgraph myTitle\n\n' +
|
||||
' c-->d \n\n' +
|
||||
' subgraph inner\n\n e-->f \n end \n\n' +
|
||||
' subgraph inner\n\n h-->i \n end \n\n' +
|
||||
'end\n';
|
||||
var res = flow.parser.parse(str);
|
||||
|
||||
|
@@ -124,7 +124,6 @@ var init = function () {
|
||||
|
||||
var graphType = utils.detectType(txt);
|
||||
var classes = {};
|
||||
|
||||
switch(graphType){
|
||||
case 'graph':
|
||||
classes = flowRenderer.getClasses(txt, false);
|
||||
|
Reference in New Issue
Block a user