2016-10-08 24 views
2

私は2つのチャート、折れ線グラフ、棒グラフを縦に描画するために反応を使用しています。下のbarChartを見るためにスクロールすると、各更新後、chartjsは(0,0)にスクロールします。私は、各更新後にスクロールの位置を移動しない実装をいくつか見てきました。chart.js、各更新後、スクロールしないでください。

チャートを破壊し、それを再作成するとき、私は同様の問題があった

  <canvas id="lineChart" onLoad={ load() }> 
      Your browser does not support canvas, please upgrade to latest browser 
      </canvas> 

      <canvas id="barChart" onLoad={ load() }> 
      Your browser does not support canvas, please upgrade to latest browser 
      </canvas> 

    //to load chart.js 
    var myChart = new Chart($("#barChart")[0], { 
     type: 'bar', 
     data: { 
      labels: props.labels, 
      datasets: [{ 
       label: props.label, 
       data: props.data, 
       backgroundColor: props.labels.map(l => props.color) , 
       borderColor: props.labels.map(l => props.borderColor) , 
       borderWidth: 0.01 
      }] 
     }, 
     options: { 
      scales: { 
      yAxes: [{ 
       ticks: {beginAtZero: true} 
      }] 
     } 
     } 
    }); 

答えて

1

を助けてください。私の回避策は、破壊の前にスクロール位置を取得し、作成後にスクロール位置を再適用することでした。たとえば、jQueryの場合:

var pos = $(document).scrollTop(); 
if (chart != undefined) 
chart.destroy(); 

chart = new Chart(ctx, chartOptions); 
$(document).scrollTop(pos); 
関連する問題