Hugging Face's logo

Spaces:
furqankassa
/
MermaidModelHTML5Demo
Running

App Files Community
furqankassa awacke1 commited on
Commit
4addf17
•
0 Parent(s):

Duplicate from awacke1/MermaidModelHTML5Demo

Browse files

Co-authored-by: Aaron C Wacker <[email protected]>

Files changed (4) hide show
  1. .gitattributes +34 -0
  2. README.md +11 -0
  3. index.html +97 -0
  4. style.css +28 -0
.gitattributes ADDED
@@ -0,0 +1,34 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ *.7z filter=lfs diff=lfs merge=lfs -text
2
+ *.arrow filter=lfs diff=lfs merge=lfs -text
3
+ *.bin filter=lfs diff=lfs merge=lfs -text
4
+ *.bz2 filter=lfs diff=lfs merge=lfs -text
5
+ *.ckpt filter=lfs diff=lfs merge=lfs -text
6
+ *.ftz filter=lfs diff=lfs merge=lfs -text
7
+ *.gz filter=lfs diff=lfs merge=lfs -text
8
+ *.h5 filter=lfs diff=lfs merge=lfs -text
9
+ *.joblib filter=lfs diff=lfs merge=lfs -text
10
+ *.lfs.* filter=lfs diff=lfs merge=lfs -text
11
+ *.mlmodel filter=lfs diff=lfs merge=lfs -text
12
+ *.model filter=lfs diff=lfs merge=lfs -text
13
+ *.msgpack filter=lfs diff=lfs merge=lfs -text
14
+ *.npy filter=lfs diff=lfs merge=lfs -text
15
+ *.npz filter=lfs diff=lfs merge=lfs -text
16
+ *.onnx filter=lfs diff=lfs merge=lfs -text
17
+ *.ot filter=lfs diff=lfs merge=lfs -text
18
+ *.parquet filter=lfs diff=lfs merge=lfs -text
19
+ *.pb filter=lfs diff=lfs merge=lfs -text
20
+ *.pickle filter=lfs diff=lfs merge=lfs -text
21
+ *.pkl filter=lfs diff=lfs merge=lfs -text
22
+ *.pt filter=lfs diff=lfs merge=lfs -text
23
+ *.pth filter=lfs diff=lfs merge=lfs -text
24
+ *.rar filter=lfs diff=lfs merge=lfs -text
25
+ *.safetensors filter=lfs diff=lfs merge=lfs -text
26
+ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
27
+ *.tar.* filter=lfs diff=lfs merge=lfs -text
28
+ *.tflite filter=lfs diff=lfs merge=lfs -text
29
+ *.tgz filter=lfs diff=lfs merge=lfs -text
30
+ *.wasm filter=lfs diff=lfs merge=lfs -text
31
+ *.xz filter=lfs diff=lfs merge=lfs -text
32
+ *.zip filter=lfs diff=lfs merge=lfs -text
33
+ *.zst filter=lfs diff=lfs merge=lfs -text
34
+ *tfevents* filter=lfs diff=lfs merge=lfs -text
README.md ADDED
@@ -0,0 +1,11 @@
 
 
 
 
 
 
 
 
 
 
 
 
1
+ ---
2
+ title: 🧜‍♀️📉📈Graph Mermaid Model Visualization📊HTML5
3
+ emoji: 🧜‍♀️📉📈
4
+ colorFrom: pink
5
+ colorTo: gray
6
+ sdk: static
7
+ pinned: false
8
+ duplicated_from: awacke1/MermaidModelHTML5Demo
9
+ ---
10
+
11
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html ADDED
@@ -0,0 +1,97 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width" />
6
+ <title>My static Space</title>
7
+ <link rel="stylesheet" href="style.css" />
8
+ <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
9
+ <script>mermaid.initialize({startOnLoad:true});</script>
10
+ </head>
11
+ <body>
12
+
13
+
14
+ <iframe
15
+ src="https://awacke1-cb-gr-chatbot-blenderbot.hf.space"
16
+ frameborder="0"
17
+ width="1280"
18
+ height="1024"
19
+ ></iframe>
20
+
21
+ <iframe
22
+ src="https://awacke1-image-semantic-search.hf.space"
23
+ frameborder="0"
24
+ width="1280"
25
+ height="1024"
26
+ ></iframe>
27
+
28
+ <iframe
29
+ src="https://awacke1-image-to-multilingual-ocr.hf.space"
30
+ frameborder="0"
31
+ width="1280"
32
+ height="1024"></iframe>
33
+ <iframe
34
+ src="https://awacke1-sentence2paragraph.hf.space"
35
+ frameborder="0"
36
+ width="1280"
37
+ height="1024"></iframe>
38
+ <iframe
39
+ src="https://awacke1-video-summary.hf.space"
40
+ frameborder="0"
41
+ width="1280"
42
+ height="1024"></iframe>
43
+
44
+
45
+ <iframe
46
+ src="https://awacke1-ai-quantum.hf.space"
47
+ frameborder="0"
48
+ width="1280"
49
+ height="1024"
50
+ ></iframe>
51
+
52
+
53
+ <div class="mermaid">
54
+ journey
55
+ title Create AI
56
+ section Training
57
+ Format DataSet Inputs Files, Data Splits: 5: Teacher
58
+ Model Build w/ SKLearn, TF, Pytorch: 3: Student
59
+ Determine Model Performance: 1: Teacher, Student
60
+ section Deploy
61
+ Web Deploy Local and Cloud: 5: Teacher
62
+ Architecture Spaces Gradio Streamlit Heroku AWS Azure and GCCP: 5: Teacher
63
+ section Testing
64
+ Test Model with Input Datasets: 5: Teacher
65
+ Examples. Inputs that Work, Inputs That Break Model: 5: Teacher
66
+ Governance - Analyze, Publish Fairness, Equity, Bias for Datasets and Outputs: 5: Teacher
67
+ </div>
68
+
69
+ <div class="mermaid">
70
+ sequenceDiagram
71
+ participant Alice
72
+ participant Bob
73
+ Alice->>John: Hello John, how are you?
74
+ loop Healthcheck
75
+ John->>John: Fight against hypochondria
76
+ end
77
+ Note right of John: Rational thoughts<br/>prevail...
78
+ John-->>Alice: Great!
79
+ John->>Bob: How about you?
80
+ Bob-->>John: Jolly good!
81
+ </div>
82
+
83
+ <div class="card">
84
+ <h1>Welcome to the Mermaid Modeler Tip Sheet</h1>
85
+ <p>
86
+ You can use Mermaid inside HTML5 by including the script and a div with the class or mermaid.
87
+ </p>
88
+ <p>
89
+ Documentation is located here:
90
+ <a href="https://mermaid.js.org/syntax/flowchart.html" target="_blank"
91
+ >Mermaid documentation</a
92
+ >.
93
+ </p>
94
+ </div>
95
+
96
+ </body>
97
+ </html>
style.css ADDED
@@ -0,0 +1,28 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ padding: 2rem;
3
+ font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
+ }
5
+
6
+ h1 {
7
+ font-size: 16px;
8
+ margin-top: 0;
9
+ }
10
+
11
+ p {
12
+ color: rgb(107, 114, 128);
13
+ font-size: 15px;
14
+ margin-bottom: 10px;
15
+ margin-top: 5px;
16
+ }
17
+
18
+ .card {
19
+ max-width: 620px;
20
+ margin: 0 auto;
21
+ padding: 16px;
22
+ border: 1px solid lightgray;
23
+ border-radius: 16px;
24
+ }
25
+
26
+ .card p:last-child {
27
+ margin-bottom: 0;
28
+ }