如何在圖表中添加滾動條

您好我已經使用公共數據創建了一個示例圖表，但它有更多的數據要顯示在圖表中，所以我試圖沿着x軸添加滾動條，以便所有的數據都整齊地顯示出來。但是我發現很難將滾動條添加到x軸，所以如何將滾動條添加到圖表。我附上了一張plnkr供觀看。請幫助me.Thank你:)如何在圖表中添加滾動條

控制器：

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); 
     } 
}) 
})

Plunker File

來源

2017-02-12 sree

我不認爲你可以添加一個滾動條，而不是你可以跳過點，並顯示一些圖案 – Sajeetharan

能說清楚。 – sree

檢查答案 – Sajeetharan

由於angular.chart響應本身，您不必手動添加滾動條，而不是序使圖爲了顯眼，你可以沿x軸做蜱跳過。

添加到您的選擇配置，

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

    };

DEMO

來源

2017-02-12 16:12:16 Sajeetharan

如何在圖表中添加滾動條

回答

相關問題