Skip to content

Commit 4143032

Browse files
sidharthv96sidharthv96
authored
Merge pull request #3842 from mermaid-js/per/revert-1d9fefe7ac65990e4dd06a7e0e29976a873db844
Revert "Added pie"
2 parents 231965d + 9eb506f commit 4143032

File tree

6 files changed

+23
-238
lines changed

6 files changed

+23
-238
lines changed

‎cypress/platform/per.html

+16-30
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,6 @@
66
rel="stylesheet"
77
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
88
/>
9-
<link
10-
href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css"
11-
rel="stylesheet"
12-
/>
139
<link
1410
href="https://fonts.googleapis.com/css?family=Noto+Sans+SC&display=swap"
1511
rel="stylesheet"
@@ -29,12 +25,6 @@
2925
}
3026
.mermaid svg {
3127
/* font-size: 18px !important; */
32-
background-color: #eee;
33-
background-image: radial-gradient(#fff 1%, transparent 11%),
34-
radial-gradient(#fff 1%, transparent 11%);
35-
background-size: 20px 20px;
36-
background-position: 0 0, 10px 10px;
37-
background-repeat: repeat;
3828
}
3929
.malware {
4030
position: fixed;
@@ -56,33 +46,29 @@
5646
<body>
5747
<div>Security check</div>
5848
<pre id="diagram" class="mermaid">
59-
bar title Pets adopted by volunteers
60-
"Dogs" : 386
61-
"Cats" : 85
62-
"Rats" : 15
63-
</pre>
64-
65-
<!-- <div id="cy"></div> -->
66-
<!-- <script src="http://localhost:9000/packages/mermaid-mindmap/dist/mermaid-mindmap-detector.js"></script> -->
67-
<!-- <script src="./mermaid-example-diagram-detector.js"></script> -->
68-
<!-- <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js"></script> -->
69-
<script src="./mermaid.js"></script>
70-
49+
flowchart LR
50+
A-->B
51+
</pre
52+
>
53+
<pre id="diagram" class="mermaid2">
54+
mindmap
55+
root
56+
ch1
57+
ch2
58+
</pre
59+
>
60+
<script src="./packages/mermaid-mindmap/dist/mermaid-mindmap-detector.js"></script>
61+
<script src="./packages/mermaid-mindmap/dist/mermaid-example-diagram-detector.js"></script>
62+
<script src="./packages/mermaid/dist/mermaid.js"></script>
7163
<script>
7264
mermaid.parseError = function (err, hash) {
7365
// console.error('Mermaid error: ', err);
7466
};
7567
mermaid.initialize({
76-
theme: 'forest',
7768
startOnLoad: true,
7869
logLevel: 0,
79-
// basePath: './packages/',
80-
// themeVariables: { darkMode: true },
81-
lazyLoadedDiagrams: [
82-
'./mermaid-mindmap-detector.esm.mjs',
83-
'./mermaid-example-diagram-detector.esm.mjs',
84-
],
85-
// lazyLoadedDiagrams: ['../../mermaid-mindmap/registry.ts'],
70+
basePath: './packages/',
71+
// themeVariables: {relationLabelColor: 'red'}
8672
});
8773
function callback() {
8874
alert('It worked');

‎demos/pie.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ <h1>Pie chart demos</h1>
1919
pie title Pets adopted by volunteers
2020
accTitle: simple pie char demo
2121
accDescr: pie chart with 3 sections: dogs, cats, rats. Most are dogs.
22-
"Dogs" : 140
22+
"Dogs" : 386
2323
"Cats" : 85
2424
"Rats" : 15
2525
</pre>

‎packages/mermaid/src/diagrams/pie/parser/pie.jison

+2-8
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili
4040
<string>["] { this.popState(); }
4141
<string>[^"]* { return "txt"; }
4242
"pie" return 'PIE';
43-
"bar" return 'BAR';
4443
"showData" return 'showData';
4544
":"[\s]*[\d]+(?:\.[\d]+)? return "value";
4645
<<EOF>> return 'EOF';
@@ -54,15 +53,10 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili
5453
start
5554
: eol start
5655
| directive start
57-
| document_type document
58-
| document_type showData document {yy.setShowData(true);}
56+
| PIE document
57+
| PIE showData document {yy.setShowData(true);}
5958
;
6059

61-
document_type
62-
: PIE {yy.setDiagramType($1); }
63-
| BAR {yy.setDiagramType($1); }
64-
;
65-
6660
document
6761
: /* empty */
6862
| document line

‎packages/mermaid/src/diagrams/pie/pieDb.js

-13
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ import {
1414

1515
let sections = {};
1616
let showData = false;
17-
let diagramType = 'pie';
1817

1918
export const parseDirective = function (statement, context, type) {
2019
mermaidAPI.parseDirective(this, statement, context, type);
@@ -27,16 +26,6 @@ const addSection = function (id, value) {
2726
log.debug('Added new section :', id);
2827
}
2928
};
30-
31-
const setDiagramType = function (diagType) {
32-
diagramType = diagType;
33-
log.debug('Added diag type :', diagType);
34-
};
35-
36-
const getDiagramType = function () {
37-
return diagramType;
38-
};
39-
4029
const getSections = () => sections;
4130

4231
const setShowData = function (toggle) {
@@ -77,6 +66,4 @@ export default {
7766
getShowData,
7867
getAccDescription,
7968
setAccDescription,
80-
setDiagramType,
81-
getDiagramType,
8269
};

‎packages/mermaid/src/diagrams/pie/pieDetector.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import type { DiagramDetector } from '../../diagram-api/types';
22

33
export const pieDetector: DiagramDetector = (txt) => {
4-
const logOutput = txt.match(/^\s*pie/) !== null || txt.match(/^\s*bar/) !== null;
5-
return logOutput;
4+
return txt.match(/^\s*pie/) !== null;
65
};

‎packages/mermaid/src/diagrams/pie/pieRenderer.js

+3-184
Original file line numberDiff line numberDiff line change
@@ -6,200 +6,20 @@ import * as configApi from '../../config';
66
import addSVGAccessibilityFields from '../../accessibility';
77

88
let conf = configApi.getConfig();
9+
910
/**
10-
* Draws a Bar Chart with the data given in text.
11+
* Draws a Pie Chart with the data given in text.
1112
*
1213
* @param text
13-
* @param txt
1414
* @param id
15-
* @param _version
16-
* @param diagObj
1715
*/
18-
// export const drawBarChart = (txt, id, _version, diagObj) => {
19-
// try {
20-
// let locDiagType;
21-
22-
// conf = configApi.getConfig();
23-
// log.debug('Rendering info diagram\n' + txt);
24-
// locDiagType = diagObj.db.getDiagramType();
25-
// const securityLevel = configApi.getConfig().securityLevel;
26-
// // Handle root and Document for when rendering in sandbox mode
27-
// let sandboxElement;
28-
// if (securityLevel === 'sandbox') {
29-
// sandboxElement = select('#i' + id);
30-
// }
31-
// const root =
32-
// securityLevel === 'sandbox'
33-
// ? select(sandboxElement.nodes()[0].contentDocument.body)
34-
// : select('body');
35-
// const doc = securityLevel === 'sandbox' ? sandboxElement.nodes()[0].contentDocument : document;
36-
37-
// // Parse the Pie Chart definition
38-
// diagObj.db.clear();
39-
// diagObj.parser.parse(txt);
40-
// log.debug('Parsed info diagram');
41-
// const elem = doc.getElementById(id);
42-
// width = elem.parentElement.offsetWidth;
43-
44-
// if (typeof width === 'undefined') {
45-
// width = 1200;
46-
// }
47-
48-
// if (typeof conf.useWidth !== 'undefined') {
49-
// width = conf.useWidth;
50-
// }
51-
// if (typeof conf.pie.useWidth !== 'undefined') {
52-
// width = conf.pie.useWidth;
53-
// }
54-
55-
// const diagram = root.select('#' + id);
56-
// configureSvgSize(diagram, height, width, conf.pie.useMaxWidth);
57-
58-
// addSVGAccessibilityFields(diagObj.db, diagram, id);
59-
// // Set viewBox
60-
// elem.setAttribute('viewBox', '0 0 ' + width + ' ' + height);
61-
62-
// // Fetch the default direction, use TD if none was found
63-
// var margin = 40;
64-
// var legendRectSize = 18;
65-
// var legendSpacing = 4;
66-
67-
// var radius = Math.min(width, height) / 2 - margin;
68-
69-
// var svg = diagram
70-
// .append('g')
71-
// .attr('transform', 'translate(' + width / 2 + ',' + height / 2 + ')');
72-
73-
// var data = diagObj.db.getSections();
74-
// var sum = 0;
75-
// Object.keys(data).forEach(function (key) {
76-
// sum += data[key];
77-
// });
78-
79-
// const themeVariables = conf.themeVariables;
80-
// var myGeneratedColors = [
81-
// themeVariables.pie1,
82-
// themeVariables.pie2,
83-
// themeVariables.pie3,
84-
// themeVariables.pie4,
85-
// themeVariables.pie5,
86-
// themeVariables.pie6,
87-
// themeVariables.pie7,
88-
// themeVariables.pie8,
89-
// themeVariables.pie9,
90-
// themeVariables.pie10,
91-
// themeVariables.pie11,
92-
// themeVariables.pie12,
93-
// ];
94-
95-
// // Set the color scale
96-
// var color = scaleOrdinal().range(myGeneratedColors);
97-
98-
// // Compute the position of each group on the pie:
99-
// var pieData = Object.entries(data).map(function (el, idx) {
100-
// return {
101-
// order: idx,
102-
// name: el[0],
103-
// value: el[1],
104-
// };
105-
// });
106-
// var pie = d3pie()
107-
// .value(function (d) {
108-
// return d.value;
109-
// })
110-
// .sort(function (a, b) {
111-
// // Sort slices in clockwise direction
112-
// return a.order - b.order;
113-
// });
114-
// var dataReady = pie(pieData);
115-
116-
// // Shape helper to build arcs:
117-
// var arcGenerator = arc().innerRadius(0).outerRadius(radius);
118-
119-
// // Build the pie chart: each part of the pie is a path that we build using the arc function.
120-
// svg
121-
// .selectAll('mySlices')
122-
// .data(dataReady)
123-
// .enter()
124-
// .append('path')
125-
// .attr('d', arcGenerator)
126-
// .attr('fill', function (d) {
127-
// return color(d.data.name);
128-
// })
129-
// .attr('class', 'pieCircle');
130-
131-
// // Now add the percentage.
132-
// // Use the centroid method to get the best coordinates.
133-
// svg
134-
// .selectAll('mySlices')
135-
// .data(dataReady)
136-
// .enter()
137-
// .append('text')
138-
// .text(function (d) {
139-
// return ((d.data.value / sum) * 100).toFixed(0) + '%';
140-
// })
141-
// .attr('transform', function (d) {
142-
// return 'translate(' + arcGenerator.centroid(d) + ')';
143-
// })
144-
// .style('text-anchor', 'middle')
145-
// .attr('class', 'slice');
146-
147-
// svg
148-
// .append('text')
149-
// .text(diagObj.db.getDiagramTitle())
150-
// .attr('x', 0)
151-
// .attr('y', -(height - 50) / 2)
152-
// .attr('class', 'pieTitleText');
153-
154-
// // Add the legends/annotations for each section
155-
// var legend = svg
156-
// .selectAll('.legend')
157-
// .data(color.domain())
158-
// .enter()
159-
// .append('g')
160-
// .attr('class', 'legend')
161-
// .attr('transform', function (d, i) {
162-
// var height = legendRectSize + legendSpacing;
163-
// var offset = (height * color.domain().length) / 2;
164-
// var horizontal = 12 * legendRectSize;
165-
// var vertical = i * height - offset;
166-
// return 'translate(' + horizontal + ',' + vertical + ')';
167-
// });
168-
169-
// legend
170-
// .append('rect')
171-
// .attr('width', legendRectSize)
172-
// .attr('height', legendRectSize)
173-
// .style('fill', color)
174-
// .style('stroke', color);
175-
176-
// legend
177-
// .data(dataReady)
178-
// .append('text')
179-
// .attr('x', legendRectSize + legendSpacing)
180-
// .attr('y', legendRectSize - legendSpacing)
181-
// .text(function (d) {
182-
// if (diagObj.db.getShowData() || conf.showData || conf.pie.showData) {
183-
// return d.data.name + ' [' + d.data.value + ']';
184-
// } else {
185-
// return d.data.name;
186-
// }
187-
// });
188-
// } catch (e) {
189-
// log.error('Error while rendering info diagram');
190-
// log.error(e);
191-
// }
192-
// };
193-
19416
let width;
19517
const height = 450;
19618
export const draw = (txt, id, _version, diagObj) => {
19719
try {
198-
let locDiagType;
199-
20020
conf = configApi.getConfig();
20121
log.debug('Rendering info diagram\n' + txt);
202-
locDiagType = diagObj.db.getDiagramType();
22+
20323
const securityLevel = configApi.getConfig().securityLevel;
20424
// Handle root and Document for when rendering in sandbox mode
20525
let sandboxElement;
@@ -371,5 +191,4 @@ export const draw = (txt, id, _version, diagObj) => {
371191

372192
export default {
373193
draw,
374-
// drawBarChart,
375194
};

0 commit comments

Comments
 (0)