diff --git a/cypress/platform/ashish2.html b/cypress/platform/ashish2.html
index f77f95606..c6dfdc6b0 100644
--- a/cypress/platform/ashish2.html
+++ b/cypress/platform/ashish2.html
@@ -84,8 +84,8 @@
: The first metal objects are made in Britain.Some other nice things happen. it is a good time to be alive.
-
- %%{init: { 'logLevel': 'debug', 'theme': 'default', 'timeline': {'disableMulticolor':false} } }%%
+
+ %%{'init': { 'logLevel': 'debug', 'theme': 'default', 'timeline': {'disableMulticolor':false} } }%%
timeline
title History of Social Media Platform
2002 : LinkedIn
@@ -97,10 +97,10 @@
2010 : Pinterest
- %%{init: { 'logLevel': 'debug', 'theme': 'default', 'themeVariables': {
- 'cScale0': '#ffffff',
+ %%{init: { 'logLevel': 'debug', 'theme': 'base', 'themeVariables': {
+ 'cScale0': '#ff0000',
'cScale1': '#00ff00',
- 'cScale2': '#0000ff',
+ 'cScale2': '#ff0000'
} } }%%
timeline
title History of Social Media Platform
@@ -112,6 +112,25 @@
2008s : Instagram
2010 : Pinterest
+
+
+ %%{init: { 'logLevel': 'debug', 'theme': 'default' , 'themeVariables': {
+ 'cScale0': '#ff0000',
+ 'cScale1': '#00ff00',
+ 'cScale2': '#0000ff'
+ } } }%%
+ timeline
+ title History of Social Media Platform
+ 2002 : LinkedIn
+ 2004 : Facebook : Google
+ 2005 : Youtube
+ 2006 : Twitter
+ 2007 : Tumblr
+ 2008 : Instagram
+ 2010 : Pinterest
+
+
+
timeline
title History of Social Media Platform
diff --git a/packages/mermaid-timeline/src/mermaidUtils.ts b/packages/mermaid-timeline/src/mermaidUtils.ts
index af3f97571..b733507ed 100644
--- a/packages/mermaid-timeline/src/mermaidUtils.ts
+++ b/packages/mermaid-timeline/src/mermaidUtils.ts
@@ -58,8 +58,7 @@ export const injectUtils = (
_commonDb: any,
_parseDirective: any
) => {
- _log.info('Mermaid utils injected into timeline-diagram');
- _log.info('123 ' , _parseDirective);
+ _log.debug('Mermaid utils injected into timeline-diagram');
log.trace = _log.trace;
log.debug = _log.debug;
log.info = _log.info;
diff --git a/packages/mermaid-timeline/src/svgDraw.js b/packages/mermaid-timeline/src/svgDraw.js
index bed0e2942..88f90401c 100644
--- a/packages/mermaid-timeline/src/svgDraw.js
+++ b/packages/mermaid-timeline/src/svgDraw.js
@@ -519,7 +519,7 @@ export const drawNode = function (elem, node, fullSection, conf) {
'class',
(node.class ? node.class + ' ' : '') +
'timeline-node ' +
- (section < 0 ? 'section-root' : 'section-' + section)
+ ('section-' + section)
);
const bkgElem = nodeElem.append('g');
diff --git a/packages/mermaid-timeline/src/timelineDb.js b/packages/mermaid-timeline/src/timelineDb.js
index e5de2aee3..b92715fe9 100644
--- a/packages/mermaid-timeline/src/timelineDb.js
+++ b/packages/mermaid-timeline/src/timelineDb.js
@@ -90,7 +90,7 @@ const compileTasks = function () {
}
return allProcessed;
};
-log.info('456 parseDirective',parseDirective);
+
export default {
clear,
getCommonDb,
diff --git a/packages/mermaid-timeline/src/timelineRenderer.ts b/packages/mermaid-timeline/src/timelineRenderer.ts
index 5ed6c554e..86a83f674 100644
--- a/packages/mermaid-timeline/src/timelineRenderer.ts
+++ b/packages/mermaid-timeline/src/timelineRenderer.ts
@@ -1,8 +1,6 @@
// @ts-nocheck TODO: fix file
import { select } from 'd3';
import svgDraw from './svgDraw';
-import addSVGAccessibilityFields from '../../accessibility';
-
import { log, getConfig, setupGraphViewbox } from './mermaidUtils';
export const setConf = function (cnf) {
@@ -17,15 +15,14 @@ export const draw = function (text, id, version, diagObj) {
//1. Fetch the configuration
const conf = getConfig();
const LEFT_MARGIN = conf.leftMargin?conf.leftMargin:50;
- //log conf
- log.info('conf', conf);
+
//2. Clear the diagram db before parsing
diagObj.db.clear();
//3. Parse the diagram text
diagObj.parser.parse(text + '\n');
- log.info('timeline', diagObj.db);
+ log.debug('timeline', diagObj.db);
const securityLevel = conf.securityLevel;
// Handle root and Document for when rendering in sandbox mode
@@ -45,17 +42,14 @@ export const draw = function (text, id, version, diagObj) {
//4. Fetch the diagram data
const tasks = diagObj.db.getTasks();
const title = diagObj.db.getCommonDb().getDiagramTitle();
-
- //log tasks
- log.info(tasks);
+ log.debug('task',tasks);
//5. Initialize the diagram
svgDraw.initGraphics(svg);
// fetch Sections
const sections = diagObj.db.getSections();
- // log sections
- log.info(sections);
+ log.debug('sections', sections);
let maxSectionHeight = 0;
let maxTaskHeight = 0;
@@ -81,14 +75,14 @@ export const draw = function (text, id, version, diagObj) {
maxHeight: maxSectionHeight,
};
const sectionHeight = svgDraw.getVirtualNodeHeight(svg, sectionNode, conf);
- log.info('sectionHeight before draw', sectionHeight);
+ log.debug('sectionHeight before draw', sectionHeight);
maxSectionHeight = Math.max(maxSectionHeight, sectionHeight +20);
});
//tasks length and maxEventCount
let maxEventCount = 0;
let maxEventLineLength = 0;
- log.info('tasks.length', tasks.length);
+ log.debug('tasks.length', tasks.length);
//calculate max task height
// for loop till tasks.length
for (const [i, task] of tasks.entries()) {
@@ -102,7 +96,7 @@ export const draw = function (text, id, version, diagObj) {
maxHeight: maxTaskHeight,
};
const taskHeight = svgDraw.getVirtualNodeHeight(svg, taskNode, conf);
- log.info('taskHeight before draw', taskHeight);
+ log.debug('taskHeight before draw', taskHeight);
maxTaskHeight = Math.max(maxTaskHeight, taskHeight + 20);
//calculate maxEventCount
@@ -126,8 +120,8 @@ export const draw = function (text, id, version, diagObj) {
}
- log.info('maxSectionHeight before draw', maxSectionHeight);
- log.info('maxTaskHeight before draw', maxTaskHeight);
+ log.debug('maxSectionHeight before draw', maxSectionHeight);
+ log.debug('maxTaskHeight before draw', maxTaskHeight);
if (sections && sections.length > 0) {
sections.forEach((section) => {
@@ -140,11 +134,10 @@ export const draw = function (text, id, version, diagObj) {
padding: 20,
maxHeight: maxSectionHeight,
};
- //log section node
- log.info('sectionNode', sectionNode);
+ log.debug('sectionNode', sectionNode);
const sectionNodeWrapper = svg.append('g');
const node = svgDraw.drawNode(sectionNodeWrapper, sectionNode, sectionNumber, conf);
- log.info('sectionNode output', node);
+ log.debug('sectionNode output', node);
sectionNodeWrapper.attr(
'transform',
@@ -177,7 +170,7 @@ export const draw = function (text, id, version, diagObj) {
// Get BBox of the diagram
const box = svg.node().getBBox();
- log.info('bounds', box);
+ log.debug('bounds', box);
if (title) {
svg
@@ -223,14 +216,13 @@ export const drawTasks = function (diagram, tasks, sectionColor, masterX, master
maxHeight: maxTaskHeight,
};
- //log task node
- log.info('taskNode', taskNode);
+ log.debug('taskNode', taskNode);
// create task wrapper
const taskWrapper = diagram.append('g').attr('class', 'taskWrapper');
const node = svgDraw.drawNode(taskWrapper, taskNode, sectionColor, conf);
const taskHeight = node.height;
//log task height
- log.info('taskHeight after draw', taskHeight);
+ log.debug('taskHeight after draw', taskHeight);
taskWrapper.attr(
'transform',
`translate(${masterX}, ${masterY})`
@@ -294,7 +286,7 @@ export const drawEvents = function (diagram, events, sectionColor, masterX, mast
};
//log task node
- log.info('eventNode', eventNode);
+ log.debug('eventNode', eventNode);
// create event wrapper
const eventWrapper = diagram.append('g').attr('class', 'eventWrapper');
const node = svgDraw.drawNode(eventWrapper, eventNode, sectionColor, conf)
diff --git a/packages/mermaid/src/diagram-api/diagramAPI.ts b/packages/mermaid/src/diagram-api/diagramAPI.ts
index 574e72fbc..69c4d8110 100644
--- a/packages/mermaid/src/diagram-api/diagramAPI.ts
+++ b/packages/mermaid/src/diagram-api/diagramAPI.ts
@@ -51,8 +51,6 @@ export const registerDiagram = (
addStylesForDiagram(id, diagram.styles);
if (diagram.injectUtils) {
- console.log('parseDirective', parseDirective);
-
diagram.injectUtils(log, setLogLevel, getConfig, sanitizeText, setupGraphViewbox,getCommonDb(),parseDirective);
}
};
diff --git a/packages/mermaid/src/directiveUtils.ts b/packages/mermaid/src/directiveUtils.ts
index 79888daf9..677647d44 100644
--- a/packages/mermaid/src/directiveUtils.ts
+++ b/packages/mermaid/src/directiveUtils.ts
@@ -8,7 +8,7 @@ import { directiveSanitizer } from './utils';
let currentDirective: { type?: string; args?: any } | undefined = {};
export const parseDirective = function (p: any, statement: string, context: string, type: string): void {
- log.info('parseDirective is being called', statement, context, type);
+ log.debug('parseDirective is being called', statement, context, type);
try {
if (statement !== undefined) {
statement = statement.trim();
diff --git a/packages/mermaid/src/docs/syntax/timeline.md b/packages/mermaid/src/docs/syntax/timeline.md
index 3438b4542..44b72bd79 100644
--- a/packages/mermaid/src/docs/syntax/timeline.md
+++ b/packages/mermaid/src/docs/syntax/timeline.md
@@ -140,7 +140,7 @@ mermaid.initialize({
let us look at same example, where we have disabled the multiColor option.
```mermaid-example
- %%{init: { 'logLevel': 'debug', 'theme': 'base', 'timeline': {'disableMulticolor': true}}%%
+ %%{init: { 'logLevel': 'debug', 'theme': 'base', 'timeline': {'disableMulticolor': true}}}%%
timeline
title History of Social Media Platform
2002 : LinkedIn
@@ -164,7 +164,7 @@ Now let's override the default values for the `cScale0` to `cScale2` variables:
%%{init: { 'logLevel': 'debug', 'theme': 'default' , 'themeVariables': {
'cScale0': '#ff0000',
'cScale1': '#00ff00',
- 'cScale2': '#0000ff',
+ 'cScale2': '#0000ff'
} } }%%
timeline
title History of Social Media Platform
diff --git a/packages/mermaid/src/themes/theme-default.js b/packages/mermaid/src/themes/theme-default.js
index 969551ee6..4fb898040 100644
--- a/packages/mermaid/src/themes/theme-default.js
+++ b/packages/mermaid/src/themes/theme-default.js
@@ -122,6 +122,7 @@ class Theme {
updateColors() {
/* Color Scale */
/* Each color-set will have a background, a foreground and a border color */
+
this.cScale0 = this.cScale0 || this.primaryColor;
this.cScale1 = this.cScale1 || this.secondaryColor;
this.cScale2 = this.cScale2 || this.tertiaryColor;
@@ -138,10 +139,9 @@ class Theme {
this['cScalePeer' + 2] = this['cScalePeer' + 2] || darken(this.tertiaryColor, 40);
for (let i = 0; i < this.THEME_COLOR_LIMIT; i++) {
// Setup the peer color for the set, useful for borders
- this['cScale' + i] = darken(this['cScale' + i], 10);
+ this['cScale' + i] = darken(this['cScale' + i], 10);
this['cScalePeer' + i] = this['cScalePeer' + i] || darken(this['cScale' + i], 25);
}
-
// Setup the inverted color for the set
for (let i = 0; i < this.THEME_COLOR_LIMIT; i++) {
this['cScaleInv' + i] = this['cScaleInv' + i] || adjust(this['cScale' + i], { h: 180 });