marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-25 18:30:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added notation for titles on subgraphs

Browse Source
This commit is contained in:
knsv
2015-01-10 19:23:57 +01:00
parent 3027882847
commit 27687fc742
10 changed files with 352 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -250,8 +250,10 @@ exports.draw = function (text, id,isDot) {
subGraphs.forEach(function(subG){
i = i + 1;
var id = 'subG'+i;
//console.log('Setting id '+id);
subG.forEach(function(node){
d3.selectAll('cluster').append('text');
subG.nodes.forEach(function(node){
//console.log('Setting node',node,' to subgraph '+id);
g.setParent(node,id);
});
@@ -333,8 +335,55 @@ exports.draw = function (text, id,isDot) {
render(d3.select("#" + id + " g"), g);
var svgb = document.querySelector('#mermaidChart0');
/*
var xPos = document.querySelectorAll('.clusters rect')[0].x.baseVal.value;
var width = document.querySelectorAll('.clusters rect')[0].width.baseVal.value;
var cluster = d3.selectAll('.cluster');
var te = cluster.append('text');
te.attr('x', xPos+width/2);
te.attr('y', 12);
//te.stroke('black');
te.attr('id', 'apa12');
te.style('text-anchor', 'middle');
te.text('Title for cluster');
*/
// Center the graph
svg.attr("height", g.graph().height );
svg.attr("width", g.graph().width );
svg.attr("viewBox", svgb.getBBox().x + ' 0 '+ g.graph().width+' '+ g.graph().height);
setTimeout(function(){
console.log('Fixing titles');
var i = 0;
subGraphs.forEach(function(subG){
console.log('Setting id '+id);
var clusterRects = document.querySelectorAll('#' + id + ' .clusters rect');
var clusters = document.querySelectorAll('#' + id + ' .cluster');
if(subG.title !== 'undefined'){
console.log(clusterRects[i]);
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('fill', 'black');
te.attr('stroke','none');
te.attr('id', id+'Text');
te.style('text-anchor', 'middle');
console.log('Title '+subG.title);
console.log('i',i);
console.log('x'+xPos+width/2);
console.log('y'+xPos);
te.text(subG.title);
}
i = i + 1;
});
},200);
};

4
src/diagrams/flowchart/graphDb.js
View File

@@ -212,7 +212,7 @@ exports.defaultStyle = function () {
/**
* Clears the internal graph db so that a new graph can be parsed.
*/
exports.addSubGraph = function (list) {
exports.addSubGraph = function (list, title) {
function uniq(a) {
var prims = {"boolean":{}, "number":{}, "string":{}}, objs = [];
@@ -229,7 +229,7 @@ exports.addSubGraph = function (list) {
subG = uniq(subG.concat.apply(subG,list));
subGraphs.push(subG);
subGraphs.push({nodes:subG,title:title});
};
exports.getSubGraphs = function (list) {
return subGraphs;

6
src/diagrams/flowchart/parser/flow.jison
View File

@@ -204,8 +204,10 @@ statement
{$$=[];}
| clickStatement separator
{$$=[];}
| subgraph document endStatement separator
{yy.addSubGraph($2);}
| subgraph text separator document endStatement separator
{yy.addSubGraph($4,$2);}
| subgraph separator document endStatement separator
{yy.addSubGraph($3,undefined);}
;
endStatement: end

107
src/diagrams/flowchart/parser/flow.js
View File

File diff suppressed because one or more lines are too long

8
src/diagrams/flowchart/parser/flow.spec.js
View File

@@ -249,7 +249,7 @@ describe('when parsing ',function(){
expect(edges[0].type).toBe('arrow_circle');
});
it('should handle subgraphs',function(){
var res = flow.parser.parse('graph TD;A-->B;subgraph;c-->d;end;');
var res = flow.parser.parse('graph TD;A-->B;subgraph myTitle;c-->d;end;');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();
@@ -259,7 +259,7 @@ describe('when parsing ',function(){
});
it('should handle subgraphs',function(){
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph\nc-->d\nend\n');
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph myTitle\nc-->d\nend\n');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();
@@ -269,7 +269,7 @@ describe('when parsing ',function(){
});
it('should handle subgraphs',function(){
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph\nc-->d\nend;');
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph myTitle\nc-->d\nend;');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();
@@ -279,7 +279,7 @@ describe('when parsing ',function(){
});
it('should handle subgraphs',function(){
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph\nc-- text -->d\nd-->e\n end;');
var res = flow.parser.parse('graph TD\nA-->B\nsubgraph myTitle\nc-- text -->d\nd-->e\n end;');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();