mirrors
/
mermaid
mirror of https://github.com/mermaid-js/mermaid.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Support customization of gantt diagram xAxis format using diagram code

This commit is contained in:
Tyler Long 2018-03-13 14:01:44 +08:00
parent 7ef1b28c83
commit f62736c749
6 changed files with 34 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
dist/index.html vendored
View File

@ -36,6 +36,7 @@ Alice->John: Yes... John, how are you?
<div class="mermaid">
gantt
dateFormat YYYY-MM-DD
axisFormat %d/%m
title Adding GANTT diagram to mermaid
section A section

11
src/diagrams/gantt/ganttDb.js
View File

@ -2,6 +2,7 @@ import moment from 'moment'
import { logger } from '../../logger'
let dateFormat = ''
let axisFormat = ''
let title = ''
let sections = []
let tasks = []
@ -18,6 +19,14 @@ export const clear = function () {
rawTasks = []
}
export const setAxisFormat = function (txt) {
axisFormat = txt
}
export const getAxisFormat = function () {
return axisFormat
}
export const setDateFormat = function (txt) {
dateFormat = txt
}
@ -342,6 +351,8 @@ const compileTasks = function () {
export default {
clear,
setDateFormat,
setAxisFormat,
getAxisFormat,
setTitle,
getTitle,
addSection,

2
src/diagrams/gantt/ganttRenderer.js
View File

@ -244,7 +244,7 @@ export const draw = function (text, id) {
function makeGrid (theSidePad, theTopPad, w, h) {
let xAxis = d3.axisBottom(timeScale)
.tickSize(-h + theTopPad + conf.gridLineStartPadding)
.tickFormat(d3.timeFormat(conf.axisFormat || '%Y-%m-%d'))
.tickFormat(d3.timeFormat(parser.yy.getAxisFormat() || conf.axisFormat || '%Y-%m-%d'))
svg.append('g')
.attr('class', 'grid')

2
src/diagrams/gantt/parser/gantt.jison
View File

@ -19,6 +19,7 @@
\%%[^\n]* /* skip comments */
"gantt" return 'gantt';
"dateFormat"\s[^#\n;]+ return 'dateFormat';
"axisFormat"\s[^#\n;]+ return 'axisFormat';
\d\d\d\d"-"\d\d"-"\d\d return 'date';
"title"\s[^#\n;]+ return 'title';
"section"\s[^#:\n;]+ return 'section';
@ -54,6 +55,7 @@ line
statement
: 'dateFormat' {yy.setDateFormat($1.substr(11));$$=$1.substr(11);}
| 'axisFormat' {yy.setAxisFormat($1.substr(11));$$=$1.substr(11);}
| title {yy.setTitle($1.substr(6));$$=$1.substr(6);}
| section {yy.addSection($1.substr(8));$$=$1.substr(8);}
| taskTxt taskData {yy.addTask($1,$2);$$='task';}

33
src/diagrams/gantt/parser/gantt.js
View File

@ -72,12 +72,12 @@
}
*/
var parser = (function(){
var o=function(k,v,o,l){for(o=o||{},l=k.length;l--;o[k[l]]=v);return o},$V0=[6,8,10,11,12,13,14],$V1=[1,9],$V2=[1,10],$V3=[1,11],$V4=[1,12];
var o=function(k,v,o,l){for(o=o||{},l=k.length;l--;o[k[l]]=v);return o},$V0=[6,8,10,11,12,13,14,15],$V1=[1,9],$V2=[1,10],$V3=[1,11],$V4=[1,12],$V5=[1,13];
var parser = {trace: function trace() { },
yy: {},
symbols_: {"error":2,"start":3,"gantt":4,"document":5,"EOF":6,"line":7,"SPACE":8,"statement":9,"NL":10,"dateFormat":11,"title":12,"section":13,"taskTxt":14,"taskData":15,"$accept":0,"$end":1},
terminals_: {2:"error",4:"gantt",6:"EOF",8:"SPACE",10:"NL",11:"dateFormat",12:"title",13:"section",14:"taskTxt",15:"taskData"},
productions_: [0,[3,3],[5,0],[5,2],[7,2],[7,1],[7,1],[7,1],[9,1],[9,1],[9,1],[9,2]],
symbols_: {"error":2,"start":3,"gantt":4,"document":5,"EOF":6,"line":7,"SPACE":8,"statement":9,"NL":10,"dateFormat":11,"axisFormat":12,"title":13,"section":14,"taskTxt":15,"taskData":16,"$accept":0,"$end":1},
terminals_: {2:"error",4:"gantt",6:"EOF",8:"SPACE",10:"NL",11:"dateFormat",12:"axisFormat",13:"title",14:"section",15:"taskTxt",16:"taskData"},
productions_: [0,[3,3],[5,0],[5,2],[7,2],[7,1],[7,1],[7,1],[9,1],[9,1],[9,1],[9,1],[9,2]],
performAction: function anonymous(yytext, yyleng, yylineno, yy, yystate /* action[1] */, $$ /* vstack */, _$ /* lstack */) {
/* this == yyval */
@ -102,17 +102,20 @@ case 8:
yy.setDateFormat($$[$0].substr(11));this.$=$$[$0].substr(11);
break;
case 9:
yy.setTitle($$[$0].substr(6));this.$=$$[$0].substr(6);
yy.setAxisFormat($$[$0].substr(11));this.$=$$[$0].substr(11);
break;
case 10:
yy.addSection($$[$0].substr(8));this.$=$$[$0].substr(8);
yy.setTitle($$[$0].substr(6));this.$=$$[$0].substr(6);
break;
case 11:
yy.addSection($$[$0].substr(8));this.$=$$[$0].substr(8);
break;
case 12:
yy.addTask($$[$0-1],$$[$0]);this.$='task';
break;
}
},
table: [{3:1,4:[1,2]},{1:[3]},o($V0,[2,2],{5:3}),{6:[1,4],7:5,8:[1,6],9:7,10:[1,8],11:$V1,12:$V2,13:$V3,14:$V4},o($V0,[2,7],{1:[2,1]}),o($V0,[2,3]),{9:13,11:$V1,12:$V2,13:$V3,14:$V4},o($V0,[2,5]),o($V0,[2,6]),o($V0,[2,8]),o($V0,[2,9]),o($V0,[2,10]),{15:[1,14]},o($V0,[2,4]),o($V0,[2,11])],
table: [{3:1,4:[1,2]},{1:[3]},o($V0,[2,2],{5:3}),{6:[1,4],7:5,8:[1,6],9:7,10:[1,8],11:$V1,12:$V2,13:$V3,14:$V4,15:$V5},o($V0,[2,7],{1:[2,1]}),o($V0,[2,3]),{9:14,11:$V1,12:$V2,13:$V3,14:$V4,15:$V5},o($V0,[2,5]),o($V0,[2,6]),o($V0,[2,8]),o($V0,[2,9]),o($V0,[2,10]),o($V0,[2,11]),{16:[1,15]},o($V0,[2,4]),o($V0,[2,12])],
defaultActions: {},
parseError: function parseError(str, hash) {
if (hash.recoverable) {
@ -606,9 +609,9 @@ case 4:return 4;
break;
case 5:return 11;
break;
case 6:return 'date';
case 6:return 12;
break;
case 7:return 12;
case 7:return 'date';
break;
case 8:return 13;
break;
@ -616,16 +619,18 @@ case 9:return 14;
break;
case 10:return 15;
break;
case 11:return ':';
case 11:return 16;
break;
case 12:return 6;
case 12:return ':';
break;
case 13:return 'INVALID';
case 13:return 6;
break;
case 14:return 'INVALID';
break;
}
},
rules: [/^(?:[\n]+)/i,/^(?:\s+)/i,/^(?:#[^\n]*)/i,/^(?:%[^\n]*)/i,/^(?:gantt\b)/i,/^(?:dateFormat\s[^#\n;]+)/i,/^(?:\d\d\d\d-\d\d-\d\d\b)/i,/^(?:title\s[^#\n;]+)/i,/^(?:section\s[^#:\n;]+)/i,/^(?:[^#:\n;]+)/i,/^(?::[^#\n;]+)/i,/^(?::)/i,/^(?:$)/i,/^(?:.)/i],
conditions: {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12,13],"inclusive":true}}
rules: [/^(?:[\n]+)/i,/^(?:\s+)/i,/^(?:#[^\n]*)/i,/^(?:%[^\n]*)/i,/^(?:gantt\b)/i,/^(?:dateFormat\s[^#\n;]+)/i,/^(?:axisFormat\s[^#\n;]+)/i,/^(?:\d\d\d\d-\d\d-\d\d\b)/i,/^(?:title\s[^#\n;]+)/i,/^(?:section\s[^#:\n;]+)/i,/^(?:[^#:\n;]+)/i,/^(?::[^#\n;]+)/i,/^(?::)/i,/^(?:$)/i,/^(?:.)/i],
conditions: {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14],"inclusive":true}}
});
return lexer;
})();

2
todo.md
View File

@ -3,5 +3,3 @@
- Create a desktop client
- Flowchart `interpolate` is useless because there is no rendering code using it
- Each type of diagram should have its own set of CSS.
- Support customization of gantt diagram xAxis format using diagram code
- Some one created a great PR: https://github.com/knsv/mermaid/pull/624