Started renderer development

demos/index.html

@@ -75,6 +75,9 @@
       <li>
         <h2><a href="./zenuml.html">ZenUML</a></h2>
       </li>
+      <li>
+        <h2><a href="./sankey.html">Sankey</a></h2>
+      </li>
     </ul>
   </body>
 </html>

demos/sankey.html

@@ -16,15 +16,11 @@
     <h1>Sankey diagram demos</h1>
     <h2>Simple flow</h2>
     <pre class="mermaid">
-      stateDiagram-v2
+      sankey
-      direction LR
+      a--10->b
-      State1: A state with a note
+      c--20->b
-      note right of State1
+      b--15->d
-        Important information!<br />You can write notes.<br />And\nthey\ncan\nbe\nmulti-\nline.
+      a-- 7->d
-      end note
-      State1 --> State2
-      note left of State2 : Notes can be to the left of a state\n(like this one).
-      note right of State2 : Notes can be to the right of a state\n(like this one).
     </pre>
     <script type="module">
       import mermaid from './mermaid.esm.mjs';

packages/mermaid/src/diagrams/sankey/energy.csv

@@ -0,0 +1,69 @@
+source,target,value
+Agricultural 'waste',Bio-conversion,124.729
+Bio-conversion,Liquid,0.597
+Bio-conversion,Losses,26.862
+Bio-conversion,Solid,280.322
+Bio-conversion,Gas,81.144
+Biofuel imports,Liquid,35
+Biomass imports,Solid,35
+Coal imports,Coal,11.606
+Coal reserves,Coal,63.965
+Coal,Solid,75.571
+District heating,Industry,10.639
+District heating,Heating and cooling - commercial,22.505
+District heating,Heating and cooling - homes,46.184
+Electricity grid,Over generation / exports,104.453
+Electricity grid,Heating and cooling - homes,113.726
+Electricity grid,H2 conversion,27.14
+Electricity grid,Industry,342.165
+Electricity grid,Road transport,37.797
+Electricity grid,Agriculture,4.412
+Electricity grid,Heating and cooling - commercial,40.858
+Electricity grid,Losses,56.691
+Electricity grid,Rail transport,7.863
+Electricity grid,Lighting & appliances - commercial,90.008
+Electricity grid,Lighting & appliances - homes,93.494
+Gas imports,Ngas,40.719
+Gas reserves,Ngas,82.233
+Gas,Heating and cooling - commercial,0.129
+Gas,Losses,1.401
+Gas,Thermal generation,151.891
+Gas,Agriculture,2.096
+Gas,Industry,48.58
+Geothermal,Electricity grid,7.013
+H2 conversion,H2,20.897
+H2 conversion,Losses,6.242
+H2,Road transport,20.897
+Hydro,Electricity grid,6.995
+Liquid,Industry,121.066
+Liquid,International shipping,128.69
+Liquid,Road transport,135.835
+Liquid,Domestic aviation,14.458
+Liquid,International aviation,206.267
+Liquid,Agriculture,3.64
+Liquid,National navigation,33.218
+Liquid,Rail transport,4.413
+Marine algae,Bio-conversion,4.375
+Ngas,Gas,122.952
+Nuclear,Thermal generation,839.978
+Oil imports,Oil,504.287
+Oil reserves,Oil,107.703
+Oil,Liquid,611.99
+Other waste,Solid,56.587
+Other waste,Bio-conversion,77.81
+Pumped heat,Heating and cooling - homes,193.026
+Pumped heat,Heating and cooling - commercial,70.672
+Solar PV,Electricity grid,59.901
+Solar Thermal,Heating and cooling - homes,19.263
+Solar,Solar Thermal,19.263
+Solar,Solar PV,59.901
+Solid,Agriculture,0.882
+Solid,Thermal generation,400.12
+Solid,Industry,46.477
+Thermal generation,Electricity grid,525.531
+Thermal generation,Losses,787.129
+Thermal generation,District heating,79.329
+Tidal,Electricity grid,9.452
+UK land based bioenergy,Bio-conversion,182.01
+Wave,Electricity grid,19.013
+Wind,Electricity grid,289.366

packages/mermaid/src/diagrams/sankey/parser/sankey.jison

@@ -53,10 +53,9 @@ document
 	|
 	;
 
-	// : NODE exhaust intake exhaust_chain optional_attributes EOS
 line
 	: stream optional_attributes EOS
-	| NODE optional_attributes EOS
+	| node optional_attributes EOS
 	| EOS
 	;
 
@@ -67,9 +66,12 @@ attribute: ATTRIBUTE EQUAL value | ATTRIBUTE;
 
 value: VALUE | OPEN_STRING STRING CLOSE_STRING;
 
-stream: NODE ARROW AMOUNT ARROW tail;
+stream: node ARROW AMOUNT ARROW tail { yy.addNode($1); yy.addLink(); };
-tail: stream | NODE;
+tail: stream | node;
 
+node: NODE { yy.addNode($1) };
+
+// : NODE exhaust intake exhaust_chain optional_attributes EOS
 // exhaust_chain: ARROW AMOUNT intake_chain | ;
 // intake_chain: ARROW NODE exhaust_chain | ;
 

packages/mermaid/src/diagrams/sankey/sankeyDB.js

@@ -1,69 +0,0 @@
-import { log } from '../../logger.js';
-import mermaidAPI from '../../mermaidAPI.js';
-import * as configApi from '../../config.js';
-import common from '../common/common.js';
-import {
-  setAccTitle,
-  getAccTitle,
-  setDiagramTitle,
-  getDiagramTitle,
-  getAccDescription,
-  setAccDescription,
-  clear as commonClear,
-} from '../../commonDb.js';
-
-let sections = {};
-let showData = false;
-
-export const parseDirective = function (statement, context, type) {
-  mermaidAPI.parseDirective(this, statement, context, type);
-};
-
-const addSection = function (id, value) {
-  id = common.sanitizeText(id, configApi.getConfig());
-  if (sections[id] === undefined) {
-    sections[id] = value;
-    log.debug('Added new section :', id);
-  }
-};
-const getSections = () => sections;
-
-const setShowData = function (toggle) {
-  showData = toggle;
-};
-
-const getShowData = function () {
-  return showData;
-};
-
-const cleanupValue = function (value) {
-  if (value.substring(0, 1) === ':') {
-    value = value.substring(1).trim();
-    return Number(value.trim());
-  } else {
-    return Number(value.trim());
-  }
-};
-
-const clear = function () {
-  sections = {};
-  showData = false;
-  commonClear();
-};
-
-export default {
-  parseDirective,
-  getConfig: () => configApi.getConfig().pie,
-  addSection,
-  getSections,
-  cleanupValue,
-  clear,
-  setAccTitle,
-  getAccTitle,
-  setDiagramTitle,
-  getDiagramTitle,
-  setShowData,
-  getShowData,
-  getAccDescription,
-  setAccDescription,
-};

packages/mermaid/src/diagrams/sankey/sankeyDB.ts

@@ -0,0 +1,106 @@
+import { log } from '../../logger.js';
+import mermaidAPI from '../../mermaidAPI.js';
+import * as configApi from '../../config.js';
+import common from '../common/common.js';
+import {
+  // setAccTitle,
+  // getAccTitle,
+  // getAccDescription,
+  // setAccDescription,
+  setDiagramTitle,
+  getDiagramTitle,
+  clear as commonClear,
+} from '../../commonDb.js';
+
+// export const parseDirective = function (statement, context, type) {
+//   mermaidAPI.parseDirective(this, statement, context, type);
+// };
+
+// export const cleanupComments = (text: string): string => {
+//   return text.trimStart().replace(/^\s*%%(?!{)[^\n]+\n?/gm, '');
+// };
+let links:Array<Link> = [];
+let nodes: {[id: string]: Node} = {};
+
+const clear = function () {
+  links = [];
+  nodes = {}
+  commonClear();
+};
+
+
+type Nullable<T> = T | null;
+
+
+class Link {
+  sourceNode: Nullable<Node>
+  targetNode: Nullable<Node>
+  constructor() {
+    this.sourceNode = null;
+    this.targetNode = null;
+  }
+}
+
+/**
+ * Adds a stream between two elements on the diagram
+ * 
+ * @param sourceNodeID - The id Node where the link starts
+ * @param targetNodeID - The id Node where the link ends
+*/
+
+interface IAddLink {
+  sourceNodeID?: string;
+  targetNodeID?: string;
+  // amount?: number;
+}
+
+const addLink = ({sourceNodeID, targetNodeID}: IAddLink = {}): Link => {
+  const link: Link = new Link();
+  
+  if(typeof(sourceNodeID) !== 'undefined') link.sourceNode = addNode(sourceNodeID);
+  if(typeof(targetNodeID) !== 'undefined') link.targetNode = addNode(targetNodeID);
+  
+  links.push(link);
+
+  return link;
+}
+
+
+class Node {
+  id: string;
+  title: string;
+  constructor(id: string) {
+    this.id = id;
+    this.title = id;
+  }
+}
+
+/**
+ * Finds or creates a new Node by ID
+ * 
+ * @param id - The id Node
+ */
+const addNode = (id: string): Node => {
+  id = common.sanitizeText(id, configApi.getConfig());
+  let node: Node;
+  if (nodes[id] === undefined) {
+    nodes[id] = new Node(id);
+  }
+  node = nodes[id];
+  return node;
+}
+
+export default {
+  // sankey interface
+  addLink,
+  addNode,
+  // common DB interface
+  // TODO: If this is a must this probably should be an interface
+  // getAccTitle,
+  // setAccTitle,
+  // getAccDescription,
+  // setAccDescription,
+  getDiagramTitle,
+  setDiagramTitle,
+  clear
+};

packages/mermaid/src/diagrams/sankey/sankeyRenderer.ts

@@ -8,8 +8,16 @@ import { Diagram } from '../../Diagram.js';
  * @param _version - Mermaid version from package.json
  * @param diagObj - A standard diagram containing the db and the text and type etc of the diagram
  */
-export const draw = function (_text: string, id: string, _version: string, diagObj: Diagram) {
+export const draw = function (text: string, id: string, _version: string, diagObj: Diagram) {
-  return '';
+  
+  debugger;
+  // diagObj.db.clear();
+  diagObj.parser.parse(text);
+  
+  // const elem = doc.getElementById(id);
+
+  debugger;
+  return 'TEST';
 }
 
 export default {