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

remove magic nos in renderer

Browse Source
This commit is contained in:
Raghu Rajagopalan
2016-04-01 14:17:21 +05:30
parent d8805ae4d7
commit a92e116a21
3 changed files with 65 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
dist/www/javascripts/lib/mermaid.js vendored
View File

@@ -53632,6 +53632,14 @@ var Logger = require('../../logger');
var log = new Logger.Log();
var allCommitsDict = {};
var branchNum;
var config = {
nodeWidth: 75,
lineStrokeWidth: 4,
branchLineHeight: 50,
lineColor: "grey",
leftMargin: 50
};
exports.setConf = function (config) {};
function svgCreateDefs(svg) {
@@ -53655,7 +53663,7 @@ function svgDrawLine(svg, points, interpolate) {
return Math.round(d.y);
}).interpolate(interpolate);
svg.append("svg:path").attr("d", lineGen(points)).style("stroke", "grey").style("stroke-width", "4").style("fill", "none");
svg.append("svg:path").attr("d", lineGen(points)).style("stroke", config.lineColor).style("stroke-width", config.lineStrokeWidth).style("fill", "none");
}
// Pass in the element and its pre-transform coords
function getElementCoords(element, coords) {
@@ -53677,20 +53685,20 @@ function svgDrawLineForCommits(svg, fromId, toId) {
var fromBbox = getElementCoords(svg.select("#node-" + fromId + " circle"));
var toBbox = getElementCoords(svg.select("#node-" + toId + " circle"));
//log.debug("svgDrawLineForCommits: ", fromBbox, toBbox);
if (fromBbox.left - toBbox.left > 100) {
var lineStart = { x: fromBbox.left - 100, y: toBbox.top + toBbox.height / 2 };
if (fromBbox.left - toBbox.left > config.nodeWidth) {
var lineStart = { x: fromBbox.left - config.nodeWidth, y: toBbox.top + toBbox.height / 2 };
var lineEnd = { x: toBbox.left + toBbox.width, y: toBbox.top + toBbox.height / 2 };
svgDrawLine(svg, [lineStart, lineEnd], "linear");
svgDrawLine(svg, [{ x: fromBbox.left, y: fromBbox.top + fromBbox.height / 2 }, { x: fromBbox.left - 50, y: fromBbox.top + fromBbox.height / 2 }, { x: fromBbox.left - 50, y: lineStart.y }, lineStart]);
svgDrawLine(svg, [{ x: fromBbox.left, y: fromBbox.top + fromBbox.height / 2 }, { x: fromBbox.left - config.nodeWidth / 2, y: fromBbox.top + fromBbox.height / 2 }, { x: fromBbox.left - config.nodeWidth / 2, y: lineStart.y }, lineStart]);
} else {
svgDrawLine(svg, [{
"x": fromBbox.left,
"y": fromBbox.top + fromBbox.height / 2
}, {
"x": fromBbox.left - 50,
"x": fromBbox.left - config.nodeWidth / 2,
"y": fromBbox.top + fromBbox.height / 2
}, {
"x": fromBbox.left - 50,
"x": fromBbox.left - config.nodeWidth / 2,
"y": toBbox.top + toBbox.height / 2
}, {
"x": toBbox.left + toBbox.width,
@@ -53703,25 +53711,22 @@ function cloneNode(svg, selector) {
return svg.select(selector).node().cloneNode(true);
}
function renderCommitHistory(svg, commitid, branches, direction, branchNum) {
function renderCommitHistory(svg, commitid, branches, direction) {
var commit;
branchNum = branchNum || 1;
if (_.isString(commitid)) {
do {
commit = allCommitsDict[commitid];
log.debug("in renderCommitHistory", commit.id, commit.seq);
if (svg.select("#node-" + commitid).size() > 0) return;
if (svg.select("#node-" + commitid).size() > 0) {
return;
}
svg.append(function () {
return cloneNode(svg, "#def-commit");
}).attr("class", "commit").attr("id", function () {
return "node-" + commit.id;
})
//.append("use")
.attr("transform", function () {
return "translate(" + (commit.seq * 100 + 50) + ", " + branchNum * 50 + ")";
})
//.attr("xlink:href", "#def-commit")
.attr("fill", "yellow").attr("stroke", "grey").attr("stroke-width", "2");
}).attr("transform", function () {
return "translate(" + (commit.seq * config.nodeWidth + config.leftMargin) + ", " + branchNum * config.branchLineHeight + ")";
}).attr("fill", "yellow").attr("stroke", "grey").attr("stroke-width", "2");
commitid = commit.parent;
} while (commitid && allCommitsDict[commitid]);
@@ -53729,8 +53734,9 @@ function renderCommitHistory(svg, commitid, branches, direction, branchNum) {
if (_.isArray(commitid)) {
log.debug("found merge commmit", commitid);
renderCommitHistory(svg, commitid[0], branches, direction, branchNum);
renderCommitHistory(svg, commitid[1], branches, direction, ++branchNum);
renderCommitHistory(svg, commitid[0], branches, direction);
branchNum++;
renderCommitHistory(svg, commitid[1], branches, direction);
}
}
@@ -53761,17 +53767,16 @@ exports.draw = function (txt, id, ver) {
allCommitsDict = db.getCommits();
var branches = db.getBranchesAsObjArray();
var svg = d3.select('#' + id);
svgAddArrowMarker(svg);
svgCreateDefs(svg);
var branchNum = 1;
branchNum = 1;
_.each(branches, function (v, k) {
renderCommitHistory(svg, v.commit.id, branches, direction, branchNum);
renderCommitHistory(svg, v.commit.id, branches, direction);
renderLines(svg, v.commit);
branchNum++;
});
svg.attr('height', 900);
svg.attr('width', 1200);
svg.attr('width', 2500);
} catch (e) {
log.error("Error while rendering gitgraph");
log.error(e.message);

48
src/diagrams/gitGraph/gitGraphRenderer.js
View File

@@ -6,10 +6,19 @@ var Logger = require('../../logger');
var log = new Logger.Log();
var allCommitsDict = {};
var branchNum;
var config = {
nodeWidth: 75,
lineStrokeWidth: 4,
branchLineHeight: 50,
lineColor: "grey",
leftMargin: 50
}
exports.setConf = function(config) {
}
function svgCreateDefs(svg) {
svg.append("defs")
.append("g")
@@ -52,8 +61,8 @@ function svgDrawLine(svg, points, interpolate) {
svg
.append("svg:path")
.attr("d", lineGen(points))
.style("stroke", "grey")
.style("stroke-width", "4")
.style("stroke", config.lineColor)
.style("stroke-width", config.lineStrokeWidth)
.style("fill", "none");
}
// Pass in the element and its pre-transform coords
@@ -76,24 +85,24 @@ function svgDrawLineForCommits(svg, fromId, toId) {
var fromBbox = getElementCoords(svg.select("#node-" + fromId + " circle"));
var toBbox = getElementCoords(svg.select("#node-" + toId + " circle"));
//log.debug("svgDrawLineForCommits: ", fromBbox, toBbox);
if (fromBbox.left - toBbox.left > 100) {
var lineStart = { x: fromBbox.left - 100, y: toBbox.top + toBbox.height/2};
if (fromBbox.left - toBbox.left > config.nodeWidth) {
var lineStart = { x: fromBbox.left - config.nodeWidth, y: toBbox.top + toBbox.height/2};
var lineEnd ={ x: toBbox.left + toBbox.width, y: toBbox.top + toBbox.height/2 };
svgDrawLine(svg, [lineStart , lineEnd], "linear")
svgDrawLine(svg, [
{x: fromBbox.left, y: fromBbox.top + fromBbox.height/2},
{x: fromBbox.left - 50, y: fromBbox.top + fromBbox.height/2},
{x: fromBbox.left - 50, y: lineStart.y},
{x: fromBbox.left - config.nodeWidth/2, y: fromBbox.top + fromBbox.height/2},
{x: fromBbox.left - config.nodeWidth/2, y: lineStart.y},
lineStart]);
} else {
svgDrawLine(svg, [{
"x": fromBbox.left,
"y": fromBbox.top + fromBbox.height / 2
}, {
"x": fromBbox.left - 50,
"x": fromBbox.left - config.nodeWidth/2,
"y": fromBbox.top + fromBbox.height / 2
}, {
"x": fromBbox.left - 50,
"x": fromBbox.left - config.nodeWidth/2,
"y": toBbox.top + toBbox.height / 2
}, {
"x": toBbox.left + toBbox.width,
@@ -106,14 +115,15 @@ function cloneNode(svg, selector) {
return svg.select(selector).node().cloneNode(true);
}
function renderCommitHistory(svg, commitid, branches, direction, branchNum) {
function renderCommitHistory(svg, commitid, branches, direction) {
var commit;
branchNum = branchNum || 1;
if (_.isString(commitid)) {
do {
commit = allCommitsDict[commitid];
log.debug("in renderCommitHistory", commit.id, commit.seq);
if (svg.select("#node-" + commitid).size() > 0) return;
if (svg.select("#node-" + commitid).size() > 0) {
return;
}
svg
.append(function() {
return cloneNode(svg, "#def-commit");
@@ -122,11 +132,10 @@ function renderCommitHistory(svg, commitid, branches, direction, branchNum) {
.attr("id", function() {
return "node-" + commit.id;
})
//.append("use")
.attr("transform", function() {
return "translate(" + (commit.seq * 100 + 50) + ", " + (branchNum * 50) + ")";
return "translate(" + (commit.seq * config.nodeWidth + config.leftMargin) + ", "
+ (branchNum * config.branchLineHeight) + ")";
})
//.attr("xlink:href", "#def-commit")
.attr("fill", "yellow")
.attr("stroke", "grey")
.attr("stroke-width", "2");
@@ -137,8 +146,9 @@ function renderCommitHistory(svg, commitid, branches, direction, branchNum) {
if (_.isArray(commitid)) {
log.debug("found merge commmit", commitid);
renderCommitHistory(svg, commitid[0], branches, direction, branchNum);
renderCommitHistory(svg, commitid[1], branches, direction, ++branchNum);
renderCommitHistory(svg, commitid[0], branches, direction);
branchNum++;
renderCommitHistory(svg, commitid[1], branches, direction);
}
}
@@ -170,15 +180,15 @@ exports.draw = function(txt, id, ver) {
var branches = db.getBranchesAsObjArray();
var svg = d3.select('#' + id);
svgCreateDefs(svg);
var branchNum = 1;
branchNum = 1;
_.each(branches, function(v, k) {
renderCommitHistory(svg, v.commit.id, branches, direction, branchNum);
renderCommitHistory(svg, v.commit.id, branches, direction);
renderLines(svg, v.commit);
branchNum++;
})
svg.attr('height', 900);
svg.attr('width', 1200);
svg.attr('width', 2500);
} catch (e) {
log.error("Error while rendering gitgraph");
log.error(e.message);

10
testgitgraph.mm
View File

@@ -14,5 +14,13 @@ gitGraph :
commit
merge newbranch
commit
checkout newbranch
merge other
commit
branch bug
checkout bug
commit
commit
checkout master
commit
checkout bug
merge master