Redmine 에서 Mermaid 이용하는 방법 » 이력 » 버전 2
Jinwuk Admin, 2018/07/23 13:45
| 1 | 1 | Jinwuk Admin | h1. Redmine 에서 Mermaid 이용하는 방법 |
|---|---|---|---|
| 2 | 1 | Jinwuk Admin | |
| 3 | 1 | Jinwuk Admin | "이 사이트를 참조한다":https://serol.ro/posts/2016/redmine_mermaid_js/ |
| 4 | 1 | Jinwuk Admin | |
| 5 | 1 | Jinwuk Admin | redmine에서 간단히 Mermaid를 사용하는 방법을 알아본다. 결론은 mermaid.js를 참조할 수 있게 하면 되는 것이다. |
| 6 | 1 | Jinwuk Admin | |
| 7 | 1 | Jinwuk Admin | h2. mermaid.js와 css를 redmine 안에 집어 넣기 |
| 8 | 1 | Jinwuk Admin | |
| 9 | 1 | Jinwuk Admin | The first step is to include mermaid javascript and css files, I just added those three lines to @/usr/share/redmine/app/views/layouts/base.html.erb@ file somewhere between @<head> </head>@ tags |
| 10 | 1 | Jinwuk Admin | |
| 11 | 1 | Jinwuk Admin | 그런데 Windows의 Bitnami redmine stack에서는 Apache 서버 밑에 해당 폴더가 존재한다. |
| 12 | 1 | Jinwuk Admin | Linux의 경우는 Default로 Apcache 서버가 설치되어 있어 이러한 구조를 가지지 않는다. |
| 13 | 1 | Jinwuk Admin | (Linux의 Apache서버에서 해당 Directory를 연결/등록만 시켜주면 된다) |
| 14 | 1 | Jinwuk Admin | |
| 15 | 1 | Jinwuk Admin | <pre> |
| 16 | 1 | Jinwuk Admin | /C/Bitnami/redmine-2.6.5-0/apps/redmine/htdocs/app/views/layouts |
| 17 | 1 | Jinwuk Admin | </pre> |
| 18 | 1 | Jinwuk Admin | |
| 19 | 1 | Jinwuk Admin | 여기서 <head> </head> tags 사이에 다음코드를 삽입한다. |
| 20 | 1 | Jinwuk Admin | |
| 21 | 1 | Jinwuk Admin | <pre><code class="ruby"> |
| 22 | 1 | Jinwuk Admin | <link rel="stylesheet" href="http://knsv.github.io/mermaid/css/mermaid.css"> |
| 23 | 1 | Jinwuk Admin | <script type="text/javascript" src="https://cdn.rawgit.com/knsv/mermaid/0.5.8/dist/mermaid.js"></script> |
| 24 | 1 | Jinwuk Admin | <script>mermaid.initialize({startOnLoad:true});</script> |
| 25 | 1 | Jinwuk Admin | </code></pre> |
| 26 | 1 | Jinwuk Admin | |
| 27 | 2 | Jinwuk Admin | h2. 예제: Wiki Editor에 적용하기 |
| 28 | 2 | Jinwuk Admin | |
| 29 | 2 | Jinwuk Admin | @/usr/share/redmine/lib/redmine/wiki_formatting/macros.rb@ 에 다음의 Macro를 삽입하여 Wiki editor에서 사용하도록 한다, |
| 30 | 2 | Jinwuk Admin | |
| 31 | 2 | Jinwuk Admin | <pre><code class="ruby"> |
| 32 | 2 | Jinwuk Admin | desc "Add mermaid graphs to your wiki. Example:\n\n {{mermaid\ngraph TD;\n A-->B;\nA-->C;\nB-->D;\nC-->D;\n}}" |
| 33 | 2 | Jinwuk Admin | macro :mermaid do |obj, args, text| |
| 34 | 2 | Jinwuk Admin | out = ''.html_safe |
| 35 | 2 | Jinwuk Admin | out << content_tag('div', text, :class => 'mermaid') |
| 36 | 2 | Jinwuk Admin | out |
| 37 | 2 | Jinwuk Admin | end |
| 38 | 2 | Jinwuk Admin | </code></pre> |
