score:2
Please check my JSfiddle Polar Chart
for your answer,
I had used extra extensions named
let me know if any more help require
score:3
There is another option using this extension:
Here is a fiddle: https://jsfiddle.net/beaver71/39293jes/
or a snippet in SO:
angular.module("app", ["chart.js"]).controller("ChartCtrl", function($scope) {
$scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
$scope.data = [65, 59, 80, 81, 56, 55, 40];
var sum = $scope.data.reduce(function add(a, b) {
return a + b;
}, 0);
$scope.options = {
pieceLabel: {
render: function (args) {
return args.label + " " + Math.round(args.value*100/sum,2)+"%";
},
fontColor: '#000',
position: 'outside',
segment: true
}
};
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.js"></script>
<script src="https://cdn.jsdelivr.net/angular.chartjs/latest/angular-chart.js"></script>
<script src="https://rawgit.com/beaver71/Chart.PieceLabel.js/master/build/Chart.PieceLabel.min.js"></script>
<div ng-app="app" ng-controller="ChartCtrl">
<canvas id="pie" class="chart chart-polar-area"
chart-data="data" chart-labels="labels" chart-options="options">
</canvas>
</div>
Source: stackoverflow.com
Related Query
- Show labels on each sector to polar chart using angular js chart
- How to show percentage (%) using chartjs-plugin-labels ( Pie chart ) in angular 2/8
- How to draw outer labels for polar chart using ng2-charts and chart.js at fixed positions outside the rings?
- How to show symbols after the label and before the numeric value using chart.js Bar chart in Angular
- How to show bar chart labels clearly using ChartJS?
- how to show only each 15th x-labels in line chart chart.js in angular 6?
- Show the latest labels in a bar chart with React.js using react-chartjs
- Chart.js Show labels on Pie chart
- chart.js: Show labels outside pie chart
- Chart.js how to show cursor pointer for labels & legends in line chart
- Display a limited number of labels only on X-Axis of Line Chart using Chart.js
- How to access labels array using chart plugin (Chart.pluginService.register) in Chartjs 2.x?
- Chartjs - show elements in all datasets on hover using bar chart
- How to display the labels in doughnut chart using ng2 charts?
- ChartJS: Show all labels of a mixed chart in the tooltip
- Show count concatenated to labels using chart.js
- Extending Existing Chart Types angular chart js using chart js 2.0
- Create multiple dynamic stacked chart using chart.js in Angular 10?
- How to set single color on each bar in angular chart js
- Show point values in Radar Chart using chart.js
- Display labels on bar chart using Chart.js
- ChartJS (React) Line Chart - How to show single tooltip with data and labels from 3 (multiple) dataset?
- Angular chart how to show the legend data value by default along with legend name
- angular-chart.js : how to show numbers in each bar of stacked bar chart
- how can i modify scale labels in angular chart js?
- Chart.js: How to get x-axis labels to show on top of bars in bar chart
- How to use set the color for each bar in a bar chart using chartjs?
- How to show slice value inside of slice in pie chart using chart.js
- Using two JSON objects to make Chart.JS Bar Chart Dynamic in Typescript / Angular
- Labels (category type) on left and right of bar chart using chart.js?
More Query from same tag
- Chart JS Re-Animate chart with onclick
- Embed unique identifier in Chart.js segments?
- Chart js does not load on page
- Can I use a variable as index in for loop in python?
- Chart Js change text label orientation on Ox axis
- Put JSON data into chart.js pie chart
- how to make a chart.js bar chart scrollable
- Remove additional white space on left and right side of Angular Chart
- How to display a barchart in chart.js?
- ChartJS Update specific bar's background colour
- How can I increase the size of the pie (Chart.JS)?
- ChartJS automatically scaled chart has undefined min and max
- Chart.js - tooltips issue with multiple charts
- ChartJS showing incorrect data on the X-Axes
- downhole chart - recharts or chart.js or anything else?
- Pie chart with Chart.js and mySQL
- Maintain Y axis scale in graph with scroll in the X axis when the dataset grows bigger. Aspect-ratio problem
- Chart JS V3 Tooltip styling location changed?
- Nest function not summarising values
- special characters in title of charts of Charts Js
- how to show speedometer on Doughnut chart in chart.js using reactjs
- Line chart using Chart.js
- change date on x-axis dynamically
- Modifying the X-Axis Labels of a Scatterplot in Chart.js 2
- I can't add data to chartjs from codeigniter
- Chartjs xaxes tick min
- chart.js dynamically add y axes from json
- How to export a chart.js chart to excel?
- is there a way in JavaScript/TypeScript of adding two arrays in an object and sort them?
- How to update a chart using VueJS and ChartJS