25

Mermaid CLI を使用してフローチャートを生成しています ( http://knsv.github.io/mermaid/flowchart.html )。うまく機能しますが、特殊文字 (パーセント記号、括弧など) をノード内のテキストとして機能させる方法がわかりません。

説明のために、ここに Mermaid のサンプル フローチャート定義を示します (ファイル名は example.mermaid)。

graph TD
question1{Gas tank less than 1/8?}
action1[Fill tank to 100%]
question1-- Yes -->action1

そのファイルでmermaidを実行すると、次のエラーが発生します（パーセント記号で爆発します）：

My-MacBook-Pro:mermaid mark$ mermaid example.mermaid 
Error: Parse error on line 3:
...on1[Fill tank to 100%]question1-- Yes -
-----------------------^
Expecting 'QUOTE', 'TAG_END', 'TAG_START', 'MULT', 'EQUALS', 'PLUS', 'DOT', 'BRKT', 'COLON', 'ALPHA', 'COMMA', 'NUM', 'CLICK', 'CLASS', 'CLASSDEF', 'LINKSTYLE', 'STYLE', 'PIPE', 'THICK_ARROW_OPEN', 'THICK_ARROW_CROSS', 'THICK_ARROW_CIRCLE', 'THICK_ARROW_POINT', 'DOTTED_ARROW_OPEN', 'DOTTED_ARROW_CROSS', 'DOTTED_ARROW_CIRCLE', 'DOTTED_ARROW_POINT', 'ARROW_OPEN', 'ARROW_CROSS', 'ARROW_CIRCLE', 'ARROW_POINT', '==', '-.', '--', 'MINUS', 'DIAMOND_STOP', 'DIAMOND_START', 'PE', 'PS', 'SQE', 'SQS', 'end', 'subgraph', 'NEWLINE', 'TAGSTART', 'TAGEND', 'DIR', 'SPACE', 'GRAPH', 'EOF', 'SEMI', got 'PCT'

  ../dist/mermaid.full.js:14712 in parseError
  ../dist/mermaid.full.js:14782 in parse
  ../dist/mermaid.full.js:13260
  ../dist/mermaid.full.js:16846
  ../dist/mermaid.full.js:16889
  phantomjs://webpage.evaluate():23 in executeInPage
  phantomjs://webpage.evaluate():29
  phantomjs://webpage.evaluate():29
PHANTOM ERROR: TypeError: 'null' is not an object (evaluating 'element.setAttribute')
TRACE:
 -> /usr/local/lib/node_modules/mermaid/lib/phantomscript.js: 149 (in function resolveSVGElement)
 -> /usr/local/lib/node_modules/mermaid/lib/phantomscript.js: 69

次のように、パーセント記号をエスケープしてみました。

action1[Fill tank to 100&]

しかし、セミコロンで同じエラーが発生します。それらのキャラクターをエスケープして機能させる方法について何か考えはありますか? ありがとう！

4

3 に答える 3

35

""あなたの例では、引用符を使用してテキストを囲み、特殊文字をエスケープします。

graph TD

    question1{"Gas tank less than 1/8?"}
    action1["Fill tank to 100%"]

    question1-- Yes -->action1

次の図が生成されます。

ここに画像の説明を入力

これは現在、公式ドキュメントに記載されています。

于 2015-12-08T22:49:46.920 に答える
1

これは、初期の人魚バージョンの問題でした。私はあなたのサンプルコードをmermaid 0.4.0で試してみましたが、うまくレンダリングされました。アップグレードをお勧めします。

于 2015-03-15T15:22:26.717 に答える