2017-06-19 11 views
0

私はいくつかのグラフを表示しようとしていますが、私はいくつかの助けを使うことができる2つのメインを持っています。最初のresponsive = falseは、グラフを読み込むたびにグラフが大きくなり、2番目に私のホバーツールヒントが機能しないように見えるため、動作していないようです。ここでresponsive = false not working

は私のチャートのコードは次のようになります。

<div id="myChart" style="width:200px;"></div> 

それは私の作品:

var ctx = document.getElementById("myChart").getContext("2d"); //this.$refs.canvas 

var myChart = new Chart(ctx, { 
    type: 'pie', 
    data: { 
     labels: ["Checked", "Un-Checked"], 
     datasets: [{ 
     label: '# of Hits', 
     data: [1000, 500], 
     backgroundColor: [ 
      'rgba(54, 162, 235, 0.2)', 
      'rgba(255, 206, 86, 0.2)' 
     ], 
     borderColor: [ 
      'rgba(54, 162, 235, 1)', 
      'rgba(255, 206, 86, 1)' 
     ], 
     borderWidth: 1 
     }] 
    }, 
    options: { 

     responsive: false 

    } 
}); 
+0

... – silvachathura

答えて

0

は次のように、一定の幅myChartを与えます。

0

キャンバスサイズが変更されたときの検出は、CANVAS要素から直接行うことはできません。 Chart.jsは親コンテナを使用してキャンバスのレンダリングと表示サイズを更新します。ただし、この方法では、コンテナを相対的に配置してチャートキャンバス専用にする必要があります。応答性は、コンテナのサイズ

ソースの相対的な値を設定することによって達成することができます:親divの内側に設定してご覧くださいhttp://www.chartjs.org/docs/latest/general/responsive.html