score:5
you could achieve that by setting the hoverborderwidth
for datasets
var ctx = document.getelementbyid("chart").getcontext('2d');
var chart = new chart(ctx, {
type: 'pie',
data: {
labels: ["microsoft internet explorer", "google chrome", "mozilla firefox", "opera", "safari"],
datasets: [{
label: 'number of votes',
data: [60, 20, 10, 8, 2],
backgroundcolor: ['#96ceff', '#424348', '#91ee7c', '#f7a35b', '#8286e9'],
bordercolor: '#fff',
borderwidth: 1,
hoverbordercolor: ['#96ceff', '#424348', '#91ee7c', '#f7a35b', '#8286e9'],
hoverborderwidth: 8
}]
},
options: {
responsive: false,
legend: {
display: false
},
tooltips: {
displaycolors: false
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.5.0/chart.min.js"></script>
<canvas id="chart" width="350" height="350"></canvas>
or, you could also create your own plugin.
Source: stackoverflow.com
Related Query
- ChartJS v2 - Outer arc when hover on a pie/doughnut segment
- How can I change the cursor on pie chart segment hover in ChartJS 3?
- Show/hide All nested data in ChartJS Pie chart when outer is shown/hidden
- Drawing pie segment percentage in middle of doughnut with chartjs issue
- How to change the cursor to a pointer when I hover over a bar in a ChartJS bar chart?
- Chartjs display label & units when mouse is hover stats
- ChartJS Doughnout Chart Pie Offset on Hover
- canvas fill text vanishes when hovering over chartjs pie chart
- ChartJS bar chart - trigger hover even when the cursor is outside of the bar
- Highlight doughnut segment on mouseenter generateLegend Chartjs 2
- ChartJS pie chart with simple parsing options doesn't render, only works when set as bar/line chart
- ChartJS showing old values when mouse over on Doughnut after updating values
- Chartjs doughnut segment pattern
- Is there any way to show tooltip by default (without hover pie chart) on chartjs
- Chart.js doughnut chart isn't showing tooltip when you hover over the left/right of the doughnut
- Remove chartjs pie chart highlight on hover
- Chartjs doc examples are lightning fast but same code is slow when reproducing
- 'require is not defined' error when attempting to use chartjs in javascript code
- ChartJS pie chart, "filling" each segment to indicate another dimension
- How to have more controls over the borderColor per arc segment for chart.js pie charts
- Chartjs Bar Chart showing old data when hovering
- Chartjs random colors for each part of pie chart with data dynamically from database
- ChartJS – is there any way to remove blank space around pie charts?
- chartjs tooltip is cut off when out of canvas
- chartjs datalabels change font and color of text displaying inside pie chart
- chartjs show dot point on hover over line chart
- ChartJS – How to show border on empty pie chart?
- Change point size and color on hover in chartjs
- ChartJS Doughnut Charts Gradient Fill
- Display values outside of pie chart in chartjs
More Query from same tag
- Group data from CSV (D3.js & Chart.js)
- ChartJS 2.0 - Huddle labels on pie chart
- Parsing webserver JSON Values to data property
- Set Animation speed - ChartJS?
- laravel-chartjs not displaying anything
- Ionic 3 Angular component load listener
- HTML how block elements to not go over footer etc
- Add a second Y-axis for Linechart in Chart.js?
- Unable to see pie chart in template using django and chart js
- 'require is not defined' error when attempting to use chartjs in javascript code
- React - How can I pass API data from one component to another in a different js file?
- Chart.js - Uncaught TypeError: Object.defineProperty called on non-object for multiple charts
- Why does one chart overlays another (chart.js)?
- Chart.JS - multiple - box - annotations - displays only the last box
- how to set start value as "0" in chartjs?
- How to change line segment color based on label value in chart.js?
- Chart.js doubles in size each time user scrolls to it
- Get Dataset Values from Chart JS onHover in Version 3
- hide labels and 0 values in chart.js?
- Don't show label tooltip in Chart.js if hover is less than 1 second
- How to update ChartJS in a long polling & stop animation stuttering?
- Performance issue, what causes it?
- Chart js logarithmic line chart showing NaN values instead of null
- chart.js color not rendering
- Vertical spacing in horizontal ChartJS Bar Graph
- Chart.js multiple series with same scale
- Chartjs v2.0: stacked bar chart
- react-chart2: Cannot read properties of undefined (reading 'map')
- Configuring locale with bundled (CDN) chartjs-adapter-date-fns.bundle.min.js?
- In ng 2 chart during the load an undefined legend gets created automatically ,Is there any way to remove it?