File size: 1,234 Bytes
585747f
0a40653
585747f
 
 
 
 
 
 
 
 
 
 
0a40653
c875e8e
585747f
 
 
 
 
 
 
c875e8e
73c565e
 
 
 
 
 
 
1bd0a6b
73c565e
 
 
 
 
 
 
 
 
c875e8e
585747f
d11c1e5
 
c875e8e
73c565e
585747f
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
import gradio as gr
#import execjs
# Define the Mermaid code for the flowchart
mermaid_code = """
graph TD;
    A[Start] --> B[Decision]
    B -- Yes --> C[Option 1]
    B -- No --> D[Option 2]
    C --> E[End]
    D --> E
    E[End] --> F[End]
"""
# Create an ExecJS context
js_c=("""
    let mermaid = require('mermaid');
    mermaid.initialize({startOnLoad:true});
    function renderMermaid(mermaidCode) {
        mermaid.mermaidAPI.render('mermaid', mermaidCode, function(svgCode, bindFunctions) {
            document.getElementById('diagram').innerHTML = svgCode;
        });
    }
""")

#def call_chart(mermaidCode):
def mm(graph):
    graphbytes = graph.encode("utf8")
    base64_bytes = base64.b64encode(graphbytes)
    base64_string = base64_bytes.decode("ascii")
    #display(Image(url="https://mermaid.ink/img/" + base64_string))
    out_im=f"""<img src="https://mermaid.ink/img/" + {base64_string}"""
    return gr.update(out_im)

"""
graph LR;
    A--> B & C & D;
    B--> A & E;
    C--> A & E;
    D--> A & E;
    E--> B & C & D;
"""
    
with gr.Blocks() as app:
    inp_text=gr.Textbox(value=mermaid_code)
    
    out_html=gr.HTML("""<div id='diagram'>Text</div>""")
    app.load(mm,inp_text,out_html)
app.launch()