Proportions Input

割合入力コンポーネント。ISLEダッシュボードの一部として使うことも、スタンドアロンで使うこともできます。後者の場合、onChange属性で変更を処理するか、bind属性でグローバル変数に値をバインドします。

オプション

• colors | array<string>: 円グラフのコンポーネントの色の配列。定義されていない場合は、カスタムカラースケールが使用されます。. Default: none.
• disabled | boolean: 入力フィールドを無効にするかどうかを制御します。. Default: false.
• height | number: 割合入力高さ（px. Default: 200.
• legends | array: グループラベル. Default: [].
• onChange | function: コールバック関数. Default: onChange(){}.
• precision | number: 割合値の表示精度. Default: 1.
• step | number: 入力ボックスの上にカーソルを置いたときに表示される矢印のステップ. Default: 0.1.

例としては、以下のようなものがあります。

ライブエディター

<ProportionsInput user id="Survey" question="Decide what is important" group="Group decision" nElements={3} colors = {[ "red", "blue", "gold" ]} personalHeight={300} groupHeight={200} margin="80px" legends={[ "bitcoin", "old", "diamonds" ]} />

<ProportionsInput
    user
    id="Survey"
    question="Decide what is important"
    group="Group decision"
    nElements={3}
    colors = {[ "red", "blue", "gold" ]}
    personalHeight={300}
    groupHeight={200}
    margin="80px"
    legends={[ "bitcoin", "old", "diamonds" ]}
/>

結果

ReferenceError: Provider is not defined