score:2
Accepted answer
Instead of attacking the SVG directly with this.graphic.attr
, you'd be better off using the API to update the slice. Point.update works well for this:
legendItemClick: function () {
var series = this.series;
for (var i=0; i < series.data.length; i++){
var point = series.data[i];
if (point == this){
// set back to old color
point.update({color: series.chart.options.colors[this.id]});
}else{
// make it gray
point.update({color: '#CCCCCC'});
}
}
return false;
}
Updated fiddle here.
score:0
Well, I can get you 50% of the way there:
point: {
events: {
click: function () {
if (event.point.sliced) {
$.each(this.series.data, function (i, e) {
if (!e.sliced) {
this.graphic.attr({
fill: '#CCCCCC'
});
}
});
}
}
}
This still breaks when you re-click the slice to slot it back in - the colors of the other slices are still grey until you click on them. Will need to look more into this.
Source: stackoverflow.com
Related Articles
- Set Colors of Different Points when Clicking on Pie Slice Legend
- Highcharts: add different colors to legend in one series histogram
- Highcharts heatmap - disabling the legend results in different colors
- How can I get inner slice when clicking on an outer slice in a HighChart donut chart?
- How to hide other series when clicking on legend on highcarts?
- Why does my Highchart look different when I transfer my code from Jsfiddle to my server?
- How to ignore hidden series when clicking on a legend using highcharts?
- set different colors for each column in highcharts
- How to disable legend click to stop pie slice from disappearing in Highcharts?
- Highcharts => Getting the id of a point when clicking on a line chart
- Add tooltip to legend in highcharts when hovering
- Highstock: When legend under the chart has many items, the chart height is small. How can I fix the height?
- Highchart data series filled with different colors
- highcharts different colors for selected columns
- Can I assign a different radius for each pie slice using Highcharts?
- Update Chart Colors When Using Styled HighCharts Version
- Increase different marker sizes when hovering series using highcharts
- Code works on fiddle but not when I do /show
- highcharts legend items align to the left when width is set
- Chart rendering issue when hiding all series via clicking on legends
- Highcharts - column color different from color in legend
- Customise Highcharts Pie Chart Selection State so that slice does not animate out when selected
- How to keep an empty slice area in highcharts after clicking on legendItem
- How to color series legend in highcharts when colorbypoint is set to true
- Show tootip and select pie slice on legend click of pie chart in HighCharts
- highcharts legend position wrong when align ='left' or 'right'?
- Showing different images in Highmaps when moving the mouse cursor to a point
- Adding different style to a series in legend in Highcharts
- Highcharts: Avoid showing extra x axis points when max x-axis value defined
- How can you have more than 10 colors represented in the graph and legend in highcharts?
- Uncaught TypeError: $(...).highcharts is not a function in aspx web page with master page but it is working with basic html page
- highcharts how to catch and insert logic in click reset zoom button event
- How to change color on the Highchart Sparkline line only?
- Line chart connectnulls but not all nulls
- Remove label from chart when exporting
- Drawing 3D bar charts using Highcharts through JS
- Highchart: drawgraph based on chart name
- How to show datalable on last value of arearange series
- high chart- how to add array in custom dataLabels formatter
- Highcharts Error 13 on Ajax Result and Dynamic Div
- Highcharts getjson and changing series type dynamically
- Merge contents of a hash containing array of arrays in jQuery/JS for Highcharts
- How to properly update the nodes on a Highcharts Sankey?
- Highcharts custom buttons with tooltips
- Highcharts Y-Axis skipped labels when dealing with large array
- How to Load More Than One CSV Using Highcharts Data Module
- Meteor highchart in modal
- highcharts map bubble with categorized classes
- Call an angular component method when we click on highchart series
- Show data of a month instead of 12 months