レーダーチャート - リファレンス
このページはリファレンスページです
Wiki内で使用されているリファレンスページです。
編集が必要だと思われる場合は、このページのディスカッションか、サイトスタッフまでご連絡ください。著者による編集ならばサイトスタッフの許可を必要としません。
評価: +12+x
blank.png

ユーザーコンポーネント名: レーダーチャート
作成者: FeS_ryuukatetuFeS_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 :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_ryuukatetuFeS_ryuukatetuのTwitterやPM等でお気軽にご連絡ください。

特に指定がない限り、このサイトのすべてのコンテンツはクリエイティブ・コモンズ 表示 - 継承3.0ライセンス の元で利用可能です。