score:4
Accepted answer
yes! that's absolutely possible.
though you could create your own plugin but, i would suggest using a chartjs plugin called chart.piecelabel.js
, which makes it much more easier to accomplish.
usage add the following in your chart options
piecelabel: {
mode: 'value'
}
var randomscalingfactor = function() {
return math.round(math.random() * 100);
};
var ctx = document.getelementbyid("chart-area").getcontext("2d");
var mydoughnut = new chart(ctx, {
type: 'doughnut',
data: {
labels: ["january", "february", "march", "april", "may"],
datasets: [{
data: [
randomscalingfactor(),
randomscalingfactor(),
randomscalingfactor(),
randomscalingfactor(),
randomscalingfactor(),
],
backgroundcolor: ['#ff3d67', '#ff9f40', '#ffcd56', '#4bc0c0', '#999999'],
bordercolor: 'white',
borderwidth: 5,
}]
},
showdatapoints: true,
options: {
tooltips: {
enabled: false
},
piecelabel: {
mode: 'value'
},
responsive: true,
legend: {
position: 'bottom',
},
title: {
display: true,
text: 'idades',
fontsize: 20
},
animation: {
animatescale: true,
animaterotate: true
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.5.0/chart.min.js"></script>
<script src="https://cdn.rawgit.com/emn178/chart.piecelabel.js/master/build/chart.piecelabel.min.js"></script>
<canvas id="chart-area"></canvas>
Source: stackoverflow.com
Related Query
- Show values on each arc doughnut Chart.js
- Show the values of each arc on doughtnut chart of chart.js
- Adding a label to a doughnut chart in Chart.js shows all values in each chart
- Force ChartJS to show Doughnut chart with null values
- Show all values in Chart js y axis
- Show labels on each sector to polar chart using angular js chart
- How to show data values in top of bar chart and line chart in chart.js 3
- Show point values in Radar Chart using chart.js
- Create a arc like doughnut chart with Chart js plugins
- angular-chart.js : how to show numbers in each bar of stacked bar chart
- angular-chart.js doughnut chart : How do I change width of the arc of a doughnut?
- Show values in Chart.js Pie chart parts
- ChartJS - Show values in the center of each bar
- I am using chart.js I sent my time values throw my api as timestamp know i need to show them in the chart as date format
- ChartJS : Hook before values are given to doughnut (absolute value in chart and real values in the tooltips)
- How to show the chartjs bar chart data values labels as text?
- How to show Nested charts Radar chart within Doughnut Chart?
- how to show speedometer on Doughnut chart in chart.js using reactjs
- Charts JS: Doughnut chart and hiding tooltip for specific data index within each dataset
- Always show doughnut Chart tooltip in Angular 5
- Chart.js How can I embed additional values to each data point in radar chart
- How can I get my Chart.JS bar chart to stack two data values together on each bar, and print a calculated value on each bar?
- How remove duplicates xAxis labels and show all values on chart
- Chart.JS: Show custom labels permanentely on doughnut chart
- how to show only each 15th x-labels in line chart chart.js in angular 6?
- Chart js always show labels on a doughnut chart
- angular-chart.js doughnut chart : how to show data in the center of a chart
- getting additional value fields from data source for dx.chartjs doughnut chart
- How to display icon arc of doughnut chart with primeVue
- Chartjs Custom Legend for Doughnut Chart Having Labelled Lines Sticking Out of Each Section
More Query from same tag
- chartjs with local dates
- How do I place a new line in a label with Chart.js?
- How to add title inside doughnut chart in Angular Chart?
- Destroying Chart js within useEffect - React
- place images over pie chart slices using chartjs
- Removing text shadow/blur from chart.js charts
- ChartJS - PieChart's Label too long and hide the PieChart
- How can I remove extra whitespace from the bottom of a line chart in chart.js?
- How to put rounded corners on a Chart.js Bar chart
- How to make x-axis start from 0 in chart.js graphs?
- Issue While Passing Dynamic Datas in React Chart Js 2
- React with chart js, labelling problems in multiple datasets for doughnut chart
- how to add Thousand separator in pie chart tooltips of charts.js
- ChartJS - Override Attributes (AngularJS)
- Different color for line segments in ChartJS
- ChartJS:align zeros on chart with multi axes
- ChartJS width undefined in React Typescript
- Is it possible to merge duplicate labels (and their datas) into one column in Chart Js?
- Vue.js Vue-chart.js linear gradient background fill
- Type check for getElementById only works with optional chaining, not with type check
- Chart.js how to set cutoutPercentages for each dataset
- Chartjs multiple barcharts , the first data will offset over view
- Passing SQL results from controller to chart.js
- Chart.JS format date in label
- Chartjs time serie in wrong format
- Unable to access list elements in Django Webpage
- In ng 2 chart during the load an undefined legend gets created automatically ,Is there any way to remove it?
- Data not displaying properly in Chart.js line chart
- How to pass sql query data onto the datasets field of chartjs using nodejs (ejs)
- New Chart.js Chart onclick