- ノードに画像の表示
- WomanNodeの表示
- 関連の線表示
- ノード追加方法
ノードに画像を表示
- my.project.designフォルダにiconsフォルダを作成
- 下記画像をiconsフォルダに保存
- https://wiki.eclipse.org/images/1/12/Man32.png
- https://wiki.eclipse.org/images/b/bc/Woman32.png
- ManNodeを選択
- New Style > Workspace Image
- ノードを画像で表示するように設定
| タブ | 設定項目 | 設定内容 | 説明 |
| General | Workspacepath | /my.project.design/icons/Man32.png | 表示するアイコンのパス |
| Labe | Show Icon | チェック解除 | ノードを表示する時に、アイコンを表示有無 |
| Label Expression | feature:name | ラベル表示内容 | |
| Label Position | border | ラベルの表示場所を境界にする |
WomanNodeを表示
ManNodeと設定方法は同じ。そのため、画像は省略
- DefaultLayer を選択
- New Diagram Element > Node
- id: WomanNode
- Domain Class: basicfamily.Woman
- Semantics Candidate Expression: feature:members
- Woman Node を選択
- New Style > Workspace Image
- Workspacepath : /my.project.design/icons/Woman32.png
- Label Show iconsチェックボックス解除
最終的に表示されるのは以下のようになる。
関連線の表示
- 参照関係の線を定義するのも、ノードと同じような仕組みで定義が可能
- Default Layerを選択
- New Diagram Element > Relation Based Edge
- id: fatherEdge
- Source Mapping: ManNode ,WomanNode
- 関連線のソースとなるノードを指定
- Target Mapping ManNode
- 関連線のターゲット（矢印の先）となるノードを指定
- Target Finder Expression: feature:father
- 関連線のターゲットとなるノードを見つける表現
ダイアグラムを表示すると、関連の線が表示される。
- motherの関連線も上記同様に設定する。
- Default Layerを選択
- New Diagram Element > Relation Based Edge
- id: motherEdge
- Source Mapping: ManNode ,WomanNode
- 関連線のソースとなるノードを指定
- Target Mapping WomanNode
- 関連線のターゲット（矢印の先）となるノードを指定
- Target Finder Expression: feature:mother
- 関連線のターゲットとなるノードを見つける表現
- 線の色等を変更したい場合
- Edge Style solidを選択して、Color > Stroke Colorで変更可能
ノード追加
ダイアグラムからノードを追加する方法
- Default Layerを選択
- New Tool > Section
- New Element Creation > Node Creation
- id: createMan
- Label:Man
- Node Mapping: ManNode
- Beginを選択
- New Operation > Change Context
- Browser Expression: var container
- Change Contextを選択
- New Operation > Create Instance
- Reference Name : members
- Type Name : basicfamily.Man
- variable Name : instance
- Create Instance を選択
- New Operation > Set
- Feature Name : name
- Value Expression : ['man'+container.members->filter(Man).size()/]
- ダイアグラムにセクションが表示される。
- Manを選択して、ダイアグラムにD&Dするとインスタンスが作成される。
WomanNodeを追加する方法はManNodeの追加方法と全く同じ。
基本的に上記のManをWomanに変更するのみ。
次回：
ダイアグラムで関連付けする方法。
