数値式の回答をレーダーチャートで表示する
数値式の回答をレーダーチャートで表示できます。
分野ごとのテストの結果をグラフ化するときに役立ちます。
Figure 1. レーダーチャートグラフ
Figure 2. 入力欄
作成手順
1.<summary>または<static_card>直下に<number-chart>を記述
数値式の回答をグラフで表示するには、<number-chart> を使用します。
<summary>直下に記述すると、"summary"タブ内にグラフが表示されます。
本ページでは <summary> タブ内に記述します。
<sammary>
<number-chart>
</number-chart>
</sammary>2.<number-chart>直下に<radar>を記述
レーダーチャートで表示させたい場合は、<radar> を使用します。
<sammary>
<number-chart>
<radar>
</radar>
</number-chart>
</sammary>|
<radar>タグに属性を指定すると、グラフにタイトルを付けたり、幅の調整や値軸の目盛り間隔を調整できます。 <radar>タグに記述可能な属性についてはこちらをご参照ください。 |
<header>
<header>では、グラフ軸の項目名を設定できます。
記述例
<header>
<axis label="コミュニケーション力" />
<axis label="リーダーシップ力" />
<axis label="キャリアデザイン力" />
<axis label="課題解決力" />
<axis label="一般教養・倫理" />
</header><data>
<data>では、凡例や、どこの入力欄の値をグラフに反映させるかを設定します。
記述例
<data>
<series label="1年">
<value card-id="grade1" field-id="communication" />
<value card-id="grade1" field-id="leadership" />
<value card-id="grade1" field-id="carrier_design" />
<value card-id="grade1" field-id="problem_solving_skills" />
<value card-id="grade1" field-id="education_ethics" />
</series>
<series label="2年">
<value card-id="grade2" field-id="communication" />
<value card-id="grade2" field-id="leadership" />
<value card-id="grade2" field-id="carrier_design" />
<value card-id="grade2" field-id="problem_solving_skills" />
<value card-id="grade2" field-id="education_ethics" />
</series>
<series label="3年">
<value card-id="grade3" field-id="communication" />
<value card-id="grade3" field-id="leadership" />
<value card-id="grade3" field-id="carrier_design" />
<value card-id="grade3" field-id="problem_solving_skills" />
<value card-id="grade3" field-id="education_ethics" />
</series>
<series label="4年">
<value card-id="grade4" field-id="communication" />
<value card-id="grade4" field-id="leadership" />
<value card-id="grade4" field-id="carrier_design" />
<value card-id="grade4" field-id="problem_solving_skills" />
<value card-id="grade4" field-id="education_ethics" />
</series>
</data><data>直下に記述するタグ
| タグ名 | 設定する属性 | 詳細 |
|---|---|---|
|
|
|
|
<series>タグに設定できる属性は他にもあります。 詳しくは、こちらをご参照ください。 |
<series>直下に記述するタグ
| タグ名 | 設定する属性 | 詳細 |
|---|---|---|
|
|
どの部分の回答をグラフに反映されるのかを設定できます。 |
完成イメージ
完成すると、下記XMLの<samamry>内部の形になります。
レーダーチャートのイメージはページトップの画像になります。
XML全体記述例
<doc id="shugaku_recipe_sample_radar-chart" title="レーダーチャート" order="1">
<doc_template>
<summary>
<number-chart>
<radar title="分野ごとのテスト" ticks="20">
<header>
<axis label="コミュニケーション力" />
<axis label="リーダーシップ力" />
<axis label="キャリアデザイン力" />
<axis label="課題解決力" />
<axis label="一般教養・倫理" />
</header>
<data>
<series label="1年">
<value card-id="grade1" field-id="communication" />
<value card-id="grade1" field-id="leadership" />
<value card-id="grade1" field-id="carrier_design" />
<value card-id="grade1" field-id="problem_solving_skills" />
<value card-id="grade1" field-id="education_ethics" />
</series>
<series label="2年">
<value card-id="grade2" field-id="communication" />
<value card-id="grade2" field-id="leadership" />
<value card-id="grade2" field-id="carrier_design" />
<value card-id="grade2" field-id="problem_solving_skills" />
<value card-id="grade2" field-id="education_ethics" />
</series>
<series label="3年">
<value card-id="grade3" field-id="communication" />
<value card-id="grade3" field-id="leadership" />
<value card-id="grade3" field-id="carrier_design" />
<value card-id="grade3" field-id="problem_solving_skills" />
<value card-id="grade3" field-id="education_ethics" />
</series>
<series label="4年">
<value card-id="grade4" field-id="communication" />
<value card-id="grade4" field-id="leadership" />
<value card-id="grade4" field-id="carrier_design" />
<value card-id="grade4" field-id="problem_solving_skills" />
<value card-id="grade4" field-id="education_ethics" />
</series>
</data>
</radar>
</number-chart>
</summary>
<cards>
<static_card id="grade1" title="1年" edit-protect-setting="false">
<field id="communication" ref="communication"/>
<field id="leadership" ref="leadership"/>
<field id="carrier_design" ref="carrier_design"/>
<field id="problem_solving_skills" ref="problem_solving_skills"/>
<field id="education_ethics" ref="education_ethics"/>
</static_card>
<static_card id="grade2" title="2年" edit-protect-setting="false">
<field id="communication" ref="communication"/>
<field id="leadership" ref="leadership"/>
<field id="carrier_design" ref="carrier_design"/>
<field id="problem_solving_skills" ref="problem_solving_skills"/>
<field id="education_ethics" ref="education_ethics"/>
</static_card>
<static_card id="grade3" title="3年" edit-protect-setting="false">
<field id="communication" ref="communication"/>
<field id="leadership" ref="leadership"/>
<field id="carrier_design" ref="carrier_design"/>
<field id="problem_solving_skills" ref="problem_solving_skills"/>
<field id="education_ethics" ref="education_ethics"/>
</static_card>
<static_card id="grade4" title="4年" edit-protect-setting="false">
<field id="communication" ref="communication"/>
<field id="leadership" ref="leadership"/>
<field id="carrier_design" ref="carrier_design"/>
<field id="problem_solving_skills" ref="problem_solving_skills"/>
<field id="education_ethics" ref="education_ethics"/>
</static_card>
</cards>
</doc_template>
<field_templates>
<field_template id="communication" type="number" max="100" min="0" title="コミュニケーション力" edit-auth="self"/>
<field_template id="leadership" type="number" max="100" min="0" title="リーダーシップ力" edit-auth="self"/>
<field_template id="carrier_design" type="number" max="100" min="0" title="キャリアデザイン力" edit-auth="self"/>
<field_template id="problem_solving_skills" type="number" max="100" min="0" title="課題解決力" edit-auth="self"/>
<field_template id="education_ethics" type="number" max="100" min="0" title="一般教養・倫理" edit-auth="self"/>
</field_templates>
</doc>