Angularjs 如何在图表中添加滚动条

您好，我已经使用公共数据创建了一个示例图表，但是它有更多的数据要显示在图表中，所以我尝试沿x轴添加滚动条，以便所有数据都能整齐地显示出来。但我发现很难将滚动条添加到x轴，因此如何将滚动条添加到图表中。我已附上一个plnkr供查看。请帮帮我。谢谢：）

控制器：

var myApp = angular.module('app',["chart.js"]);
myApp.controller("chartController",function($scope,$http){
$scope.totalDocks = [];
$scope.availDocks =[];
 $http.get("http://citibikenyc.com/stations/json")
.then(function(item){
    var dataFetched = item;
    console.log(dataFetched.data.stationBeanList[0]);
       for(var i=0; i < 100 ; i++){              
                   $scope.totalDocks.push(dataFetched.data.stationBeanList[i].totalDocks);
          $scope.availDocks.push(dataFetched.data.stationBeanList[i].availableDocks);
       }
 })
})

var myApp=angular.module（'app'，[“chart.js]”）；
控制器（“chartController”，函数（$scope，$http）{
$scope.totalDocks=[]；
$scope.availDocks=[]；
$http.get（“http://citibikenyc.com/stations/json")
.然后（功能（项目）{
var dataFetched=项目；
console.log（dataFetched.data.stationBeanList[0]）；
对于（var i=0；i<100；i++）{
$scope.totalDocks.push（dataFetched.data.stationBeanList[i].totalDocks）；
$scope.availDocks.push（dataFetched.data.stationBeanList[i].availableDocks）；
}
})
})

---

由于angular.chart本身是有响应的，所以您不必手动添加滚动条，相反，为了使图表显示清晰，您可以沿要跳过的x轴进行标记

将其添加到选项配置中

 $scope.options = {
    scales: {
      xAxes: [{
        ticks: {
          autoSkipPadding: 100
        }
      }]
    },
    responsive: true,
    maintainAspectRatio: true

  };

---

我不认为您可以添加滚动条，相反，您可以跳过点并显示一些图案。这对您想要实现的目标有帮助吗？x轴数据仍然是集群的，并且所有内容都是重叠的：（您查看了演示吗