Extension:Kroki/ja

MediaWiki 拡張機能マニュアル

Kroki リリースの状態: 安定
実装	タグ
説明	Turn text into dynamic visuals: Use Kroki to create a variety of diagrams seamlessly integrated into your wiki pages.
作者	(CptLausebaerトーク)
最新バージョン	1.0.1 (2025-01-24)
MediaWiki
データベースの変更	いいえ
ライセンス	GNU 一般公衆利用許諾書 3.0
ダウンロード	GitHub: プロジェクトのページ git リポジトリの URL [ヘルプ ] コミット履歴 注: 地域化の更新は translatewiki.net からは提供されません。
パラメーター $wgKrokiServerEndpoint
タグ ‎<kroki>
使用するフック ParserFirstCallInit OutputPageParserOutput EditPage::showEditForm:initial SoftwareInfo

The Kroki extension leverages the unified API offered by kroki.io to create diagrams directly from textual descriptions.

The diagrams, stored in the text form, can be version-controlled and saved directly in your wiki pages.

Moreover, they can be quickly updated or replaced when needed. The images will not be managed in the MediaWiki database.

This extension provide a dialog for WikiEditor and also for the VisualEditor.

インストール

• Downloadして、ファイルをextensions/フォルダー内のKrokiという名前のディレクトリ内に配置します。
• 以下のコードを LocalSettings.php ファイルの末尾に追加します:

  wfLoadExtension( 'Kroki' );
  $wgKrokiServerEndpoint = "https://kroki.io";
  

• 完了 – ウィキの「Special:Version」に移動して、拡張機能が正しくインストールされたことを確認します。

Configuration parameters

• $wgKrokiServerEndpoint sets the endpoint to use.

The default value is https://kroki.io. In order to address privacy issues and optimize performance, you should modify the server endpoint URL for the Kroki Service and use your own instance of kroki.

This can be done by adjusting the $wgKrokiServerEndpoint in the LocalSettings.php file.

For setting up the service on your own, official Docker images are available at "https://github.com/yuzutech/kroki".

Refer to the Kroki Documentation for more details on setup process: Kroki Documentation

Usage

This extension adds the ‎<kroki> tag.

The `lang` attribute defines the diagram type to be used for rendering the content provided.

An example in wikitext looks like this:

<kroki lang="blockdiag">
blockdiag {
  Kroki -> generates -> "Block diagrams";
  Kroki -> is -> "very easy!";

  Kroki [color = "greenyellow"];
  "Block diagrams" [color = "pink"];
  "very easy!" [color = "orange"];
}
</kroki>

The code above will render an image with SVG content formatted as a data URL.

<img src="data:image/svg+xml;base64,PHN2ZyB2aW...">

Available Diagram Types

The following diagram types are currently supported:

$diagramTypes = [
  'blockdiag',
  'bpmn',
  'bytefield',
  'seqdiag',
  'actdiag',
  'nwdiag',
  'packetdiag',
  'rackdiag',
  'c4plantuml',
  'd2',
  'dbml',
  'ditaa',
  'erd',
  'excalidraw',
  'graphviz',
  'mermaid',
  'nomnoml',
  'pikchr',
  'plantuml',
  'structurizr',
  'svgbob',
  'symbolator',
  'tikz',
  'vega',
  'vegalite',
  'wavedrom',
  'wireviz'
];

For additional information, refer to the Kroki documentation at https://docs.kroki.io/kroki/.