Chartjs初始动画想要从左到右改变(默认是从下到上)

问题描述 投票:0回答:1

使用chartjs 2.1.4(自定义一个),默认图表显示动画自下而上,在我们的应用程序下方画布两个按钮(左和右)

在点击左键图表动画想要从右到左,在点击右键图表动画想要从左到右显示

请提前帮助我找到解决方案

chart.js chartjs-2.6.0
1个回答
0
投票

var myData = [{x:0,y:0},{x:1,y:2},{x:2,y:1},{x:3,y:3}];
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
  type: 'line',
  data: {
    datasets: [{
      data: [myData[0]],
      lineTension: 0
    }]
  },
  labels:['a','a','a','a','a','a',],
  options: {
    scales: {
      xAxes: [{
        type: 'linear',
        ticks: {
          min: 0,
          max: 3
        }
      }],
      yAxes: [{
        ticks: {
          min: 0,
          max: 3
        }
      }]
     }
  }
});
var next = function() {
  var data = myChart.data.datasets[0].data;
  var count = data.length;
  data[count] = data[count - 1];
  myChart.update({duration: 0});
  data[count] = myData[count];
  myChart.update();
  if (count < myData.length) {
    setTimeout(next, 1000);
  }
}
setTimeout(next, 1000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>

<canvas id="myChart"></canvas>

没有简单的选择,你必须使用这样的东西。

© www.soinside.com 2019 - 2024. All rights reserved.