0
Как показать динамические данные в canvasjs с помощью angularjs. im получать данные из api и отображать их на диаграмме. Я не знаю, как назначить переменную для y точек chart.im, получая значение и сохраняя в переменной «ValueinCm» вместо статической переменной, необходимо назначить динамическое значение.Как назначить динамическое значение в диаграмме canvasjs с помощью angularjs
<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>