Spaces:
Runtime error
Runtime error
File size: 1,440 Bytes
5090883 e7a385f 5090883 52e1974 5090883 8ad9951 5090883 b118d20 5090883 52e1974 5090883 52e1974 e7a385f 52e1974 e7a385f 5090883 90efa7a 5090883 90efa7a |
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 |
import gradio as gr
import base64
html_template = """
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
<style>
.mermaid {{
display: block;
margin: auto;
}}
</style>
</head>
<body>
<div class="mermaid">{}</div>
<script>
mermaid.initialize({{ startOnLoad: true }});
</script>
</body>
</html>
"""
def render_mermaid(mermaid_code):
# Create HTML output
html_content = html_template.format(mermaid_code)
# Create PNG output
graphbytes = mermaid_code.encode("utf8")
base64_bytes = base64.urlsafe_b64encode(graphbytes)
base64_string = base64_bytes.decode("ascii")
png_url = "https://mermaid.ink/img/" + base64_string
return html_content, png_url
with gr.Blocks(theme=gr.themes.Citrus()) as mrender:
gr.Markdown("# Mermaid Diagram Renderer")
gr.Markdown("Input your Mermaid diagram code to render it and get a PNG image.")
with gr.Row():
with gr.Column():
mermaid_input = gr.Textbox(label="Mermaid Code", placeholder="Enter your Mermaid diagram code here...")
submit_btn = gr.Button("Render")
with gr.Column():
html_output = gr.HTML()
image_output = gr.Image()
submit_btn.click(fn=render_mermaid, inputs=mermaid_input, outputs=[html_output, image_output])
# Launch the app
mrender.launch()
|