Hugging Face's logo

Spaces:
Omnibus
/
Text-to-Chart
Running

App Files Community
Text-to-Chart
File size: 1,604 Bytes 
5df573e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
<!doctype html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>My static Space</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>

<style>
  #chart_box{
    align-content: center;
}
  
</style>
	</head>
	<body>
 
     
      <div id="chart_box">
        <pre id = "chart" class="mermaid">

        </pre>
      </div>
      <script>
        const queryString = window.location.search;
        const urlParams = new URLSearchParams(queryString);
        const merm = urlParams.get("mermaid");
        console.log(merm);
        this_id=document.getElementById("chart");
        //this_id.innerHTML="graph TD\nA[Start] --> B[Task 1]\nB --> C[Task 7]\nC --> D[End]"    
        this_id.innerText=merm;    
        
      </script>      

      
    <script type="module">
      const defaultConfig = {
        startOnLoad: true,
        securityLevel: 'loose',
        flowchart: {
          useMaxWidth: 0,
        },
        gantt: {
          useMaxWidth: 0,
        },
      }
      //const mermaidConfig = merge(defaultConfig, config)
      
      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';
      mermaid.initialize(defaultConfig);
      //mermaid.initialize({ securityLevel: 'loose',startOnLoad: true, useMaxWidth: 0 });
      //mermaid.initialize({ securityLevel: 'loose',startOnLoad: true });
    </script>
	</body>
</html>