In my angular chart project, I have three values and labels to display. When a user clicks on the chart, it should show the label of the clicked point. I am attempting to extract the values from the data points.
$scope.data = ["prospective","CallBacks","Closed"];
$scope.labels = ["4","2","3"];
$scope.onClick = function (points,evt) {
console.log("Points: "+JSON.stringify(points));
$scope.struct=JSON.stringify(points);
$scope.value=$scope.struct.label;
}<canvas id="pieChart" class="chart chart-pie"
chart-data="data" chart-labels="labels" chart-legend="true" chart-click="onClick">
</canvas>
<span>{{value}}</span>The log below shows the extracted Points:
[{"value":4,"outerRadius":95.5,"innerRadius":0,"fillColor":"rgba(151,187,205,0.8)","highlightColor":"rgba(151,187,205,0.8)","showStroke":true,"strokeWidth":2,"strokeColor":"#fff","startAngle":4.71238898038469,"circumference":1.9332877868244882,"label":"Prospective","_saved":{"value":4,"outerRadius":95.5,"innerRadius":0,"fillColor":"rgba(151,187,205,1)","highlightColor":"rgba(151,187,205,0.8)","showStroke":true,"strokeWidth":2,"strokeColor":"#fff","startAngle":4.71238898038469,"circumference":0,"label":"Prospective"},"endAngle":6.645676767209178}]
Although I can retrieve values from the log, when trying to use the same in $scope.value, the label appears as undefined.