0
angularjs를 사용하여 canvas에서 동적 데이터를 표시하는 방법. 메신저 API에서 데이터를 받고 차트에 표시하고 싶습니다. 나는 가치를 얻고 정적 변수 대신 변수 "ValueinCm"에 저장되는 chart.im의 y 포인트에 변수를 할당하는 방법을 모른다. 동적 값을 할당해야한다.angularjs를 사용하여 canvasjs 차트에서 동적 값을 할당하는 방법
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
var filledValue;
var app = angular.module('myApp', ["ng-fusioncharts"])
app.controller('MyController', function ($scope, $http) {
$http.get('https://example.com', {
headers: { 'Authorization': 'Basic password==' }
})
.then(function (response) {
$scope.names = response.data;
$scope.decodedFrame = atob($scope.names.dataFrame);
$scope.decodedFrameNew = $scope.decodedFrame.substring(4);
$scope.distanceinFeet = $scope.decodedFrameNew * 12.5*2.54;
$scope.Value = $scope.distanceinFeet/148;
$scope.ValueinCm = $scope.Value.toFixed(2);
filledValue = $scope.ValueinCm;
console.log(filledValue);
});
});
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
theme: "theme2",//theme1
title: {
text: "Basic Column Chart - CanvasJS"
},
animationEnabled: false, // change to true
data: [
{
// Change type to "bar", "area", "spline", "pie",etc.
type: "column",
dataPoints: [
{ label: "apple", y: filledValue },
{ label: "orange", y: 15 },
{ label: "banana", y: 25 },
{ label: "mango", y: 30 },
{ label: "grape", y: 28 }
]
}
]
});
chart.render();
}
</script>
</head>
<body ng-app="myApp">
<div ng-controller="MyController">
<div id="chartContainer" style="height: 300px; width: 100%;"></div></div>
</body>