marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-23 02:06:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

WIP - basic arrows.

Browse Source
This commit is contained in:
Raghu Rajagopalan
2016-03-30 14:36:39 +05:30
parent 413c6e12f5
commit c2bc3317c3
3 changed files with 105 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -53591,6 +53591,7 @@ exports.draw = function (txt, id, ver) {
log.debug('in gitgraph renderer', txt, id, ver);
// Parse the graph definition
parser.parse(txt + "\n");
var direction = db.getDirection();
var commits = db.getCommitsArray();
log.debug("# of commits: " + commits.length);
//log.debug("id: " + commits[0].id);
@@ -53599,13 +53600,36 @@ exports.draw = function (txt, id, ver) {
//log.debug("length:", Object.keys(db.getCommits()).length);
// Fetch the default direction, use TD if none was found
var svg = d3.select('#' + id);
var nodes = svg.selectAll("g").data(commits).enter().append("g").attr("class", "commit").attr("id", function (d) {
//<marker id="triangle" refX="5" refY="5" markerUnits="strokeWidth" fill="#666" markerWidth="4" markerHeight="3" orient="auto" viewBox="0 0 10 10">
//<path d="M 0 0 L 10 5 L 0 10 z"></path>
//</marker>
svg.append("marker").attr({
"id": "triangle",
"refX": "5",
"refY": "5",
"markerUnits": "strokeWidth",
"fill": "#666",
"markerWidth": "4",
"markerHeight": "3",
"orient": "auto",
"viewBox": "0,0,10,10"
}).append("svg:path").attr("d", "M 0 0 L 10 5 L 0 10 z");
var nodes = svg.selectAll("g.commit").data(commits).enter().append("g").attr("class", "commit").attr("id", function (d) {
return d.id;
}).attr("transform", function (d, i) {
return "translate(" + (50 + i * 100) + ", 50)";
if (direction == "TB" || direction == "BT") return "translate(50," + (50 + i * 100) + ")";
if (direction == "LR") return "translate(" + (50 + i * 100) + ", 50)";
});
var lines = svg.selectAll("g.arrows").data(commits).enter().append("g").append("line").attr("transform", function (d, i) {
if (direction == "TB" || direction == "BT") return "translate(50," + (70 + i * 100) + ")";
if (direction == "LR") return "translate(" + (70 + i * 100) + ", 50)";
}).attr({
"x1": direction == "LR" ? 0 : 0,
"y1": direction == "LR" ? 0 : 0,
"x2": direction == "LR" ? 60 : 0,
"y2": direction == "LR" ? 0 : 60
}).attr("marker-end", "url(#triangle)").attr("stroke", "black").attr("stroke-width", "3");
//g.append('text') // text label for the x axis
//.attr('x', 100)
//.attr('y', 40)
@@ -53615,17 +53639,21 @@ exports.draw = function (txt, id, ver) {
//.text('mermaid raghu'+ ver);
var circles = svg.selectAll("g.commit").append("circle").attr("r", 15).attr("fill", "yellow").attr("stroke", "grey");
var textContainer = svg.selectAll("g.commit").append("g").attr("transform", "translate(-40, 35)").attr("class", "commit-label");
var textContainer = svg.selectAll("g.commit").append("g").attr("transform", function () {
if (direction == "LR") return "translate(-30, 35)";
if (direction == "BT" || direction == "TB") return "translate(200, 0)";
}).attr("class", "commit-label");
textContainer.append("text").text(function (c) {
return c.id;
return c.id + "," + c.seq;
});
/*
var box = exports.bounds.getBounds();
var height = box.stopy-box.starty+2*conf.diagramMarginY;
var width = box.stopx-box.startx+2*conf.diagramMarginX;*/
svg.attr('height', 100);
svg.attr('width', 400);
svg.attr('height', 900);
svg.attr('width', 1200);
//svg.attr('viewBox', '0 0 300 150');
} catch (e) {
log.error("Error while rendering gitgraph");

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

@@ -1,16 +1,15 @@
var db = require('./gitGraphAst');
var gitGraphParser = require('./parser/gitGraph');
var d3 = require('../../d3');
var Logger = require('../../logger');
var log = new Logger.Log();
exports.setConf = function(config) {
exports.setConf = function (config) {
}
exports.draw = function (txt, id, ver) {
try{
try {
var parser;
parser = gitGraphParser.parser;
parser.yy = db;
@@ -18,6 +17,7 @@ exports.draw = function (txt, id, ver) {
log.debug('in gitgraph renderer', txt, id, ver);
// Parse the graph definition
parser.parse(txt + "\n");
var direction = db.getDirection();
var commits = db.getCommitsArray();
log.debug("# of commits: " + commits.length);
//log.debug("id: " + commits[0].id);
@@ -25,19 +25,60 @@ exports.draw = function (txt, id, ver) {
//log.debug("length:", commits.length);
//log.debug("length:", Object.keys(db.getCommits()).length);
// Fetch the default direction, use TD if none was found
var svg = d3.select('#'+id);
var svg = d3.select('#' + id);
//<marker id="triangle" refX="5" refY="5" markerUnits="strokeWidth" fill="#666" markerWidth="4" markerHeight="3" orient="auto" viewBox="0 0 10 10">
//<path d="M 0 0 L 10 5 L 0 10 z"></path>
//</marker>
svg.append("marker")
.attr({
"id": "triangle",
"refX": "5",
"refY": "5",
"markerUnits": "strokeWidth",
"fill": "#666",
"markerWidth": "4",
"markerHeight": "3",
"orient": "auto",
"viewBox": "0,0,10,10"
})
.append("svg:path")
.attr("d", "M 0 0 L 10 5 L 0 10 z");
var nodes = svg
.selectAll("g")
.data(commits)
.enter()
.append("g")
.attr("class", "commit")
.attr("id", function(d){return d.id;})
.attr("transform", function(d,i){
return "translate(" + (50 + i*100) + ", 50)";
});
.selectAll("g.commit")
.data(commits)
.enter()
.append("g")
.attr("class", "commit")
.attr("id", function (d) {
return d.id;
})
.attr("transform", function (d, i) {
if (direction == "TB" || direction == "BT")
return "translate(50," + (50 + i * 100) + ")";
if (direction == "LR")
return "translate(" + (50 + i * 100) + ", 50)";
});
var lines = svg.selectAll("g.arrows")
.data(commits)
.enter()
.append("g")
.append("line")
.attr("transform", function(d, i) {
if (direction == "TB" || direction == "BT")
return "translate(50," + (70 + (i * 100)) + ")";
if (direction == "LR")
return "translate(" + (70 + (i * 100)) + ", 50)";
})
.attr({
"x1": direction == "LR" ? 0:0,
"y1": direction == "LR" ? 0:0,
"x2": direction == "LR" ? 60:0,
"y2": direction == "LR" ? 0:60
})
.attr("marker-end", "url(#triangle)")
.attr("stroke", "black")
.attr("stroke-width", "3")
//g.append('text') // text label for the x axis
//.attr('x', 100)
//.attr('y', 40)
@@ -52,22 +93,28 @@ exports.draw = function (txt, id, ver) {
.attr("fill", "yellow")
.attr("stroke", "grey");
var textContainer = svg.selectAll("g.commit")
.append("g")
.attr("transform", "translate(-40, 35)")
.attr("class", "commit-label");
.append("g")
.attr("transform", function () {
if (direction == "LR") return "translate(-30, 35)";
if (direction == "BT" || direction == "TB") return "translate(200, 0)";
})
.attr("class", "commit-label");
textContainer
.append("text")
.text(function(c){ return c.id; });
.append("text")
.text(function (c) {
return c.id + "," + c.seq;
});
/*
var box = exports.bounds.getBounds();
var height = box.stopy-box.starty+2*conf.diagramMarginY;
var width = box.stopx-box.startx+2*conf.diagramMarginX;*/
svg.attr('height',100);
svg.attr('width', 400);
svg.attr('height', 900);
svg.attr('width', 1200);
//svg.attr('viewBox', '0 0 300 150');
}catch(e) {
} catch (e) {
log.error("Error while rendering gitgraph");
log.error(e.message);
}

2
testgitgraph.mm
View File

@@ -1,4 +1,4 @@
gitGraph:
gitGraph TB:
commit
branch newbranch
checkout newbranch