我正在寻找解决这个问题的方法我正面对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来说还是比较新的,所以希望有人可以告诉我除了我的温度图之外为什么对齐错误。感谢所有帮助!