mirror of
				https://github.com/mermaid-js/mermaid.git
				synced 2025-11-04 04:44:08 +01:00 
			
		
		
		
	
		
			
				
	
	
		
			30 lines
		
	
	
		
			953 B
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			30 lines
		
	
	
		
			953 B
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!DOCTYPE html>
 | 
						|
<html>
 | 
						|
  <head>
 | 
						|
    <meta charset="utf-8" />
 | 
						|
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 | 
						|
    <title>Mermaid Quick Test Page</title>
 | 
						|
    <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
 | 
						|
  </head>
 | 
						|
  <body>
 | 
						|
    <div id="graph"></div>
 | 
						|
 | 
						|
    <script type="module">
 | 
						|
      import mermaid from './mermaid.esm.mjs';
 | 
						|
      mermaid.initialize({ startOnLoad: false });
 | 
						|
      mermaid.mermaidAPI.initialize();
 | 
						|
 | 
						|
      async function rerender(text) {
 | 
						|
        const graphText = `graph TD
 | 
						|
        A[${text}] -->|Get money| B(Go shopping)`;
 | 
						|
        const { svg } = await mermaid.mermaidAPI.render('id', graphText);
 | 
						|
        console.log('\x1b[35m%s\x1b[0m', '>> graph', svg);
 | 
						|
        document.getElementById('graph').innerHTML = svg;
 | 
						|
      }
 | 
						|
      window.rerender = rerender;
 | 
						|
      await rerender('XMas');
 | 
						|
    </script>
 | 
						|
    <button id="rerender" onclick="rerender('Saturday')">Rerender</button>
 | 
						|
  </body>
 | 
						|
</html>
 |