2017-01-18 4 views
0

React-Chartjsの棒グラフがブートストラップ列全体を埋めるようにする方法がないようです。React-Chartjsを親列に書式設定する

<Col sm={ 6 } className="text-center"> 
     <Panel> 
      <h3 style={{color: "#bfbfbf"}}>1265</h3> 
      <p>orders</p> 
      <Bar width="100% !important" data={data} options={options}/> 
     </Panel> 
     <Panel> 
      <h3 style={{color: "#bfbfbf"}}>1265</h3> 
      <p>orders</p> 
      <Bar style={{ width: "100% !important", height: "auto !important" }} data={data} options={options}/> 
     </Panel> 
</Col> 

結果:

enter image description here

は、私は非常に多くの異なるサイズの画面になりますアプリケーションとして静的な入力を設定しないことを好むだろう。ここでは反応的なサイズが目標になります。

答えて

0

レスポンシブオプションを使用してJSで実行できます。

var myChart = { 
    type: 'line', 
    data: { 
     labels: getLabels(), 
     datasets: [{ 
     label: 'Graph1', 
     data: getData(), 
     }] 
    }, 
    options: { 
     'responsive' : true, 
    }