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

#945 Some bug fixes and draft docs

Browse Source
This commit is contained in:
Knut Sveidqvist
2019-10-09 20:05:24 +02:00
parent fe1e09f06b
commit 54e6e2f66e
7 changed files with 303 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/diagrams/state/parser/stateDiagram.jison
View File

@@ -112,7 +112,8 @@ line
;
statement
: idStatement DESCR { /*console.warn('got id and descr', $1, $2.trim());*/$$={ stmt: 'state', id: $1, type: 'default', description: $2.trim()};}
: idStatement { /*console.warn('got id and descr', $1);*/$$={ stmt: 'state', id: $1, type: 'default', description: ''};}
| idStatement DESCR { /*console.warn('got id and descr', $1, $2.trim());*/$$={ stmt: 'state', id: $1, type: 'default', description: $2.trim()};}
| idStatement '-->' idStatement
{
/*console.warn('got id', $1);yy.addRelation($1, $3);*/
@@ -128,10 +129,11 @@ statement
| COMPOSIT_STATE
| COMPOSIT_STATE STRUCT_START document STRUCT_STOP
{
/* console.warn('Adding document for state without id ', $1);*/
$$={ stmt: 'state', id: $1, type: 'default', description: '', doc: $3 }
}
| STATE_DESCR AS ID { $$={id: $3, type: 'default', description: $1.trim()};}
| STATE_DESCR AS ID { $$={stmt: 'state', id: $3, type: 'default', description: $1.trim()};}
| STATE_DESCR AS ID STRUCT_START document STRUCT_STOP
{
//console.warn('Adding document for state with id ', $3, $4); yy.addDocument($3);

10
src/diagrams/state/shapes.js
View File

@@ -82,7 +82,8 @@ export const drawDescrState = (g, stateDef) => {
.attr('class', 'state-title')
.text(stateDef.id);
const titleHeight = title.node().getBBox().height;
const titleBox = title.node().getBBox();
const titleHeight = titleBox.height;
const description = g
.append('text') // text label for the x axis
@@ -104,13 +105,16 @@ export const drawDescrState = (g, stateDef) => {
.attr('y2', conf.padding + titleHeight + conf.dividerMargin / 2)
.attr('class', 'descr-divider');
const descrBox = description.node().getBBox();
descrLine.attr('x2', descrBox.width + 3 * conf.padding);
console.warn(descrBox.width, titleBox.width);
const width = Math.max(descrBox.width, titleBox.width);
descrLine.attr('x2', width + 3 * conf.padding);
// const classBox = title.node().getBBox();
g.insert('rect', ':first-child')
.attr('x', conf.padding)
.attr('y', conf.padding)
.attr('width', descrBox.width + 2 * conf.padding)
.attr('width', width + 2 * conf.padding)
.attr('height', descrBox.height + titleHeight + 2 * conf.padding)
.attr('rx', '5');

14
src/diagrams/state/stateRenderer.js
View File

@@ -73,6 +73,7 @@ export const draw = function(text, id) {
compound: true,
// acyclicer: 'greedy',
rankdir: 'RL'
// ranksep: '20'
});
// // Set an object for the graph label
@@ -91,9 +92,13 @@ export const draw = function(text, id) {
const bounds = diagram.node().getBBox();
diagram.attr('height', '100%');
diagram.attr('width', '100%');
diagram.attr('viewBox', '0 0 ' + bounds.width * 2 + ' ' + (bounds.height + 50));
// diagram.attr('height', '100%');
// diagram.attr('width', 'fit-content');
diagram.attr('style', 'width: fit-content;');
diagram.attr(
'viewBox',
'0 0 ' + (bounds.width + conf.padding * 2) + ' ' + (bounds.height + conf.padding * 2)
);
};
const getLabelWidth = text => {
return text ? text.length * 5.02 : 1;
@@ -124,6 +129,7 @@ const renderDoc = (doc, diagram, parentId) => {
// isCompound: true,
// acyclicer: 'greedy',
// ranker: 'longest-path'
ranksep: '20',
ranker: 'tight-tree'
// ranker: 'network-simplex'
// isMultiGraph: false
@@ -155,7 +161,7 @@ const renderDoc = (doc, diagram, parentId) => {
node = renderDoc(stateDef.doc, sub, stateDef.id);
if (first) {
first = false;
// first = false;
sub = addIdAndBox(sub, stateDef);
let boxBounds = sub.node().getBBox();
node.width = boxBounds.width;