Chart JS的对齐问题

时间:2017-01-10 10:34:47

标签: javascript angularjs

我正在寻找解决这个问题的方法我正面对Angular ChartJs here

我不知道如何在线发布我的代码,但我的代码中的部分是屏幕截图:

JS:

angular.module('piMonitorClientApp')
  .controller('GraphCtrl', function ($scope, $state, $http, $timeout) {
console.log("Graph page log")

$scope.labels = [];


$scope.tempLabels = [];
$scope.temperatureData = [];
$scope.temperatureArray = [];
$scope.temperatureSeries = ['Temperature'];

$scope.varLabels = [];
$scope.varData = [];
$scope.varArray = [];
$scope.varSeries = ['var'];

$scope.ldrLabels = [];
$scope.ldrData = [];
$scope.ldrArray=[];
$scope.ldrSeries = ['ldr'];


$http.get("http://localhost:9001/getData")
  .success(function(response) {
    $scope.obj = response;

    angular.forEach($scope.obj, function(value) {
      if($scope.labels.indexOf(value.id) === -1) {

        $scope.tempLabels.push(value.date);
        $scope.temperatureArray.push(value.temperature);

        $scope.varLabels.push(value.date);
        $scope.varArray.push(value.var_resistor);

        $scope.ldrLabels.push(value.date);
        $scope.ldrArray.push(value.ldr);
      }
    });
  });
$scope.varData.push($scope.varArray);
$scope.temperatureData.push($scope.temperatureArray);
$scope.ldrData.push($scope.ldrArray);

HTML:

  <div class="well well-lg">
    <canvas id="line" class="chart chart-line" chart-    data="temperatureData"
                                chart-labels="tempLabels" chart-series="temperatureSeries" chart-options="options"
                                chart-click="onClick">
</canvas>

  var_resistor
<div class="well well-lg">
  <canvas id="line2" class="chart chart-line" chart-data="varData"
          chart-labels="varLabels" chart-series="varSeries" chart-options="options"
          chart-click="onClick">
  </canvas>
</div>

ldr
  <div class="well well-lg">
    <canvas id="line3" class="chart chart-line" chart-data="ldrData"
            chart-labels="ldrLabels" chart-series="ldrSeries" chart-options="options"
            chart-click="onClick">
    </canvas>
  </div>

对于AngularJs和ChartJS来说还是比较新的,所以希望有人可以告诉我除了我的温度图之外为什么对齐错误。感谢所有帮助!

0 个答案:

没有答案