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

Refactor code

Browse Source
This commit is contained in:
Tyler Long
2017-04-16 23:48:36 +08:00
parent 87c7f73245
commit 5624453c87
17 changed files with 632 additions and 923 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -50,8 +50,6 @@ exports.addVertices = function (vert, g) {
*/
var classStr = ''
// log.debug(vertice.classes);
if (vertice.classes.length > 0) {
classStr = vertice.classes.join(' ')
}
@@ -94,9 +92,6 @@ exports.addVertices = function (vert, g) {
labelTypeStr = 'svg'
verticeText = svgLabel
// verticeText = verticeText.replace(/<br\/>/g, '\n');
// labelTypeStr = 'text';
}
var radious = 0
@@ -242,7 +237,6 @@ exports.getClasses = function (text, isDot) {
// Add default class if undefined
if (typeof (classes.default) === 'undefined') {
classes.default = { id: 'default' }
// classes.default.styles = ['fill:#ffa','stroke:#666','stroke-width:3px'];
classes.default.styles = []
classes.default.clusterStyles = ['rx:4px', 'fill: rgb(255, 255, 222)', 'rx: 4px', 'stroke: rgb(170, 170, 51)', 'stroke-width: 1px']
classes.default.nodeLabelStyles = ['fill:#000', 'stroke:none', 'font-weight:300', 'font-family:"Helvetica Neue",Helvetica,Arial,sans-serf', 'font-size:14px']
@@ -307,7 +301,6 @@ exports.draw = function (text, id, isDot) {
// Fetch the verices/nodes and edges/links from the parsed graph definition
var vert = graph.getVertices()
// log.debug(vert);
var edges = graph.getEdges()
i = 0
@@ -318,7 +311,6 @@ exports.draw = function (text, id, isDot) {
d3.selectAll('cluster').append('text')
for (j = 0; j < subG.nodes.length; j++) {
// log.debug('Setting node',subG.nodes[j],' to subgraph '+id);
g.setParent(subG.nodes[j], subG.id)
}
}
@@ -435,35 +427,20 @@ exports.draw = function (text, id, isDot) {
// Set up an SVG group so that we can translate the final graph.
var svg = d3.select('#' + id)
// svgGroup = d3.select('#' + id + ' g');
// Run the renderer. This is what draws the final graph.
var element = d3.select('#' + id + ' g')
render(element, g)
// var tip = d3.tip().html(function(d) { return d; });
element.selectAll('g.node')
.attr('title', function () {
return graph.getTooltip(this.id)
})
/*
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');
*/
if (conf.useMaxWidth) {
// Center the graph
svg.attr('height', '100%')
svg.attr('width', conf.width)
// svg.attr('viewBox', svgb.getBBox().x + ' 0 '+ g.graph().width+' '+ g.graph().height);
svg.attr('viewBox', '0 0 ' + (g.graph().width + 20) + ' ' + (g.graph().height + 20))
svg.attr('style', 'max-width:' + (g.graph().width + 20) + 'px;')
} else {
@@ -474,7 +451,6 @@ exports.draw = function (text, id, isDot) {
} else {
svg.attr('width', conf.width)
}
// svg.attr('viewBox', svgb.getBBox().x + ' 0 '+ g.graph().width+' '+ g.graph().height);
svg.attr('viewBox', '0 0 ' + (g.graph().width + 20) + ' ' + (g.graph().height + 20))
}
@@ -486,7 +462,6 @@ exports.draw = function (text, id, isDot) {
if (subG.title !== 'undefined') {
var clusterRects = document.querySelectorAll('#' + id + ' #' + subG.id + ' rect')
// log.debug('looking up: #' + id + ' #' + subG.id)
var clusterEl = document.querySelectorAll('#' + id + ' #' + subG.id)
var xPos = clusterRects[0].x.baseVal.value
@@ -504,7 +479,6 @@ exports.draw = function (text, id, isDot) {
if (typeof subG.title === 'undefined') {
te.text('Undef')
} else {
// te.text(subGraphs[subGraphs.length-i-1].title);
te.text(subG.title)
}
}

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

@@ -33,12 +33,12 @@ exports.addVertex = function (id, text, type, style) {
}
if (typeof vertices[id] === 'undefined') {
vertices[id] = {id: id, styles: [], classes: []}
vertices[id] = { id: id, styles: [], classes: [] }
}
if (typeof text !== 'undefined') {
txt = text.trim()
// strip quotes if string starts and exnds with a quote
// strip quotes if string starts and exnds with a quote
if (txt[0] === '"' && txt[txt.length - 1] === '"') {
txt = txt.substring(1, txt.length - 1)
}
@@ -69,13 +69,13 @@ exports.addVertex = function (id, text, type, style) {
*/
exports.addLink = function (start, end, type, linktext) {
log.info('Got edge...', start, end)
var edge = {start: start, end: end, type: undefined, text: ''}
var edge = { start: start, end: end, type: undefined, text: '' }
linktext = type.text
if (typeof linktext !== 'undefined') {
edge.text = linktext.trim()
// strip quotes if string starts and exnds with a quote
// strip quotes if string starts and exnds with a quote
if (edge.text[0] === '"' && edge.text[edge.text.length - 1] === '"') {
edge.text = edge.text.substring(1, edge.text.length - 1)
}
@@ -119,7 +119,7 @@ exports.updateLink = function (pos, style) {
exports.addClass = function (id, style) {
if (typeof classes[id] === 'undefined') {
classes[id] = {id: id, styles: []}
classes[id] = { id: id, styles: [] }
}
if (typeof style !== 'undefined') {
@@ -252,39 +252,39 @@ var setupToolTips = function (element) {
var tooltipElem = d3.select('.mermaidTooltip')
if (tooltipElem[0][0] === null) {
tooltipElem = d3.select('body')
.append('div')
.attr('class', 'mermaidTooltip')
.style('opacity', 0)
.append('div')
.attr('class', 'mermaidTooltip')
.style('opacity', 0)
}
var svg = d3.select(element).select('svg')
var nodes = svg.selectAll('g.node')
nodes
.on('mouseover', function () {
var el = d3.select(this)
var title = el.attr('title')
// Dont try to draw a tooltip if no data is provided
if (title === null) {
return
}
var rect = this.getBoundingClientRect()
.on('mouseover', function () {
var el = d3.select(this)
var title = el.attr('title')
// Dont try to draw a tooltip if no data is provided
if (title === null) {
return
}
var rect = this.getBoundingClientRect()
tooltipElem.transition()
.duration(200)
.style('opacity', '.9')
tooltipElem.html(el.attr('title'))
.style('left', (rect.left + (rect.right - rect.left) / 2) + 'px')
.style('top', (rect.top - 14 + document.body.scrollTop) + 'px')
el.classed('hover', true)
})
.on('mouseout', function () {
tooltipElem.transition()
.duration(500)
.style('opacity', 0)
var el = d3.select(this)
el.classed('hover', false)
})
tooltipElem.transition()
.duration(200)
.style('opacity', '.9')
tooltipElem.html(el.attr('title'))
.style('left', (rect.left + (rect.right - rect.left) / 2) + 'px')
.style('top', (rect.top - 14 + document.body.scrollTop) + 'px')
el.classed('hover', true)
})
.on('mouseout', function () {
tooltipElem.transition()
.duration(500)
.style('opacity', 0)
var el = d3.select(this)
el.classed('hover', false)
})
}
funs.push(setupToolTips)
@@ -314,7 +314,7 @@ exports.defaultStyle = function () {
*/
exports.addSubGraph = function (list, title) {
function uniq (a) {
var prims = {'boolean': {}, 'number': {}, 'string': {}}
var prims = { 'boolean': {}, 'number': {}, 'string': {} }
var objs = []
return a.filter(function (item) {
@@ -330,9 +330,7 @@ exports.addSubGraph = function (list, title) {
nodeList = uniq(nodeList.concat.apply(nodeList, list))
var subGraph = {id: 'subGraph' + subCount, nodes: nodeList, title: title}
// log.debug('subGraph:' + subGraph.title + subGraph.id);
// log.debug(subGraph.nodes);
var subGraph = { id: 'subGraph' + subCount, nodes: nodeList, title: title }
subGraphs.push(subGraph)
subCount = subCount + 1
return subGraph.id
@@ -342,11 +340,9 @@ var getPosForId = function (id) {
var i
for (i = 0; i < subGraphs.length; i++) {
if (subGraphs[i].id === id) {
// log.debug('Found pos for ',id,' ',i);
return i
}
}
// log.debug('No pos found for ',id,' ',i);
return -1
}
var secCount = -1
@@ -357,9 +353,8 @@ var indexNodes = function (id, pos) {
if (secCount > 2000) {
return
}
// var nPos = getPosForId(subGraphs[pos].id);
posCrossRef[secCount] = pos
// Check if match
// Check if match
if (subGraphs[pos].id === id) {
return {
result: true,
@@ -371,7 +366,7 @@ var indexNodes = function (id, pos) {
var posCount = 1
while (count < nodes.length) {
var childPos = getPosForId(nodes[count])
// Ignore regular nodes (pos will be -1)
// Ignore regular nodes (pos will be -1)
if (childPos >= 0) {
var res = indexNodes(id, childPos)
if (res.result) {