How to use the mermaid.init function in mermaid

To help you get started, we’ve selected a few mermaid examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github hiroppy / fusuma / packages / client / src / setup / Mermaid.js View on Github external
elms.forEach((elm) => {
      Object.assign(elm.style, {
        visibility: 'initial'
      });

      mermaid.init();
      // this.encode(elm);
    });
  }
github mermaidjs / mermaid-live-editor / src / components / Preview.js View on Github external
initMermaid () {
    const {
      code,
      history,
      match: { url }
    } = this.props
    try {
      mermaid.parse(code)
      // Replacing special characters '<' and '>' with encoded '<' and '>'
      let _code = code
      _code = _code.replace(//g, '>')
      // Overriding the innerHTML with the updated code string
      this.container.innerHTML = _code
      mermaid.init(undefined, this.container)
    } catch (e) {
      // {str, hash}
      const base64 = Base64.encodeURI(e.str || e.message)
      history.push(`${url}/error/${base64}`)
    }
  }
github IceEnd / Yosoro / app / views / utils / muya / lib / utils / exportHtml.js View on Github external
renderMermaid () {
    const codes = this.exportContainer.querySelectorAll('code.language-mermaid')
    for (const code of codes) {
      const preEle = code.parentNode
      const mermaidContainer = document.createElement('div')
      mermaidContainer.innerHTML = code.innerHTML
      mermaidContainer.classList.add('mermaid')
      preEle.replaceWith(mermaidContainer)
    }
    // We only export light theme, so set mermaid theme to `default`, in the future, we can choose whick theme to export.
    mermaid.initialize({
      theme: 'default'
    })
    mermaid.init(undefined, this.exportContainer.querySelectorAll('div.mermaid'))
    if (this.muya) {
      mermaid.initialize({
        theme: this.muya.options.mermaidTheme
      })
    }
  }
github ericlink / mdp / src / renderer / script.js View on Github external
      block => mermaid.init(undefined, block)
    );
github IceEnd / Yosoro / app / views / utils / muya / lib / parser / render / index.js View on Github external
renderMermaid () {
    if (this.mermaidCache.size) {
      mermaid.initialize({
        theme: this.muya.options.mermaidTheme
      })
      mermaid.init(undefined, document.querySelectorAll(Array.from(this.mermaidCache).join(', ')))
      this.mermaidCache.clear()
    }
  }
github cj0x39e / hound-trace / packages / hound-trace-ui / src / renderCallStack.js View on Github external
}

    if (queue.length === 1 && !Array.isArray(queue[0].next)) {
        const frame = queue[0];
        graphDefinition += `\n${frame.name}`;
    }

    element.innerHTML = graphDefinition;

    document.body.appendChild(element);

    mermaid.initialize({
        theme: 'default',
        rightAngles: false
    });
    mermaid.init(undefined, element);
}