reference-rader-chart

クレジット

タイトル: レーダーチャート構文リファレンス
著者: ©︎FeS_ryuukatetu
作成年: 2023

ユーザーコンポーネント名: レーダーチャート構文
作成者: FeS_ryuukatetu

このユーザーコンポーネントを使用するには、次のコードをページに貼り付けてください。
【円形ver.】

[[include :scp-jp:user-component:radar-chart]]

【多角形ver.】

[[include :scp-jp:user-component:radar-chart-polygon]]

このコンポーネントはページ内にてレーダーチャートを使用するために作成されました。

適用例

破壊力

スピード

射程距離

持続力

精密動作性

成長性

{$label7}

{$label8}

{$label9}

{$label10}

HP

こうげき

ぼうぎょ

すばやさ

とくぼう

とくこう

{$label7}

{$label8}

{$label9}

{$label10}

使用方法例

[[include :pseudo-scp-jp:user-component-radar-chart-polygon
|no=2
|item=6
|size=250px
|stage=5
|max=150
|data1=65
|data2=65
|data3=60
|data4=130
|data5=95
|data6=110
|label1=HP
|label2=こうげき
|label3=ぼうぎょ
|label4=すばやさ
|label5=とくぼう
|label6=とくこう
]]

引数

変数名	適用できる値	必須/省略可	初期値	備考
no	数字またはアルファベット	必須(備考を参考)	1	ひとつのページに複数個のレーダーチャートを使用する場合、各includeで別の値を指定する必要があります。 ページ内にひとつしか使用しない場合のみ省略可です。
item	3~10	省略可	6	項目数を指定できます。
size	単位付きの数値(%は不可)	省略可	200px	入力した値が直径になります。
stage	1~10	省略可	5	段階数を指定できます。11以上を指定すると表示がバグるため、使用しないでください。
color	カラーコード	省略可	#ff0000	チャートの色を指定できます。
bg-color	カラーコード	省略可	#cccccc	背景色を指定できます。
line-color	カラーコード	省略可	#888888	線の色を指定できます。
max	数値	必須	-	最大値を指定します。各項目共通です。
data1~10	数値	必須	-	各項目の値を指定します。一応、限界突破も可能です。レーダーチャートの仕様上、0は避けた方が良いかもしれません(完全に消えてしまうため、表示が変に感じます)。
label1~10	文字列	必須	-	各項目につけるラベルを指定します。あんまり長くない方がいいです。
align	left/center/right	省略可	left	寄せを指定します。centerの場合、回り込みは発生しません。
clear	true/false	省略可	false	trueを指定した場合、スマホで見た際の回り込みを解除します。
sushi	true/false	省略可	true	ラベルの装飾を指定します。闇寿司フォーマット記事に引っ張りだこになったので作りました。デフォルトが闇寿司フォーマット用です。闇寿司以外で使う場合は明示的にfalseを指定してください。闇寿司フォーマット用のラベルの装飾が解除されます。なんでこんなのがあるんだ。

あとがき

コンポーネント内容について、今後改良が行われる可能性もありますのでご留意ください。
また、ご要望やご不明な点などがありましたらFeS_ryuukatetuのTwitterやPM等でお気軽にご連絡ください。