By default , when i hover on one series , other series get some transparent.
How can i disable this behavior?
this hover: { enabled: false} not working.
You need to change the opacity property for inactive state:
plotOptions: {
series: {
states: {
inactive: {
opacity: 1
}
}
}
}
Live demo: http://jsfiddle.net/BlackLabel/7fmcp0da/
API Reference: https://api.highcharts.com/highcharts/plotOptions.series.states.inactive.opacity
Related
I can get rid of all animations with this
plotOptions: {
series: {
enableMouseTracking: true
But I want tooltips. But I don't want any other mouseover effects. I tried this suggestion:
plotOptions: {
series: {
allowPointSelect: false,
states: {
hover: {
enabled: false
},
inactive: {
enabled: false
},
select: {
enabled: false
}
}
}
},
But it has no effect on animations. My series are still faded if I mouseover an area with null data.
To sum up:
when styledmode is turn on, and you loading default CSS file, you need to add following code to the CSS:
inactive { opacity: 1 }
when styledmode is disabled (by default), you don't need to add the default CSS file, but to achieve that use options provided by API:
plotOptions: {
series: {
states: {
hover: {
enabled: false
},
inactive: {
enabled: false
}
}
}
}
I am trying to change the color and borderColor of a lat/long point on a Highmap when a user clicks it. Currently when a user clicks that point it turns grey with a thick black border and a "glow" effect around it. I would like it to turn a color of my choosing. I have set the options as follows:
plotOptions: {
series: {
tooltip: {
headerFormat: '',
pointFormat: '{point.name}'
},
states: {
select: {
color: '#EFFFEF',
borderColor: 'red'
},
hover: {
color: '#a4edba'
}
}
}
}
This does not appear to be working. If I put the same states code under plotOptions.mappoint there is, again, no change.
I have repurposed the Highmaps demo with this set up. On that demo if you click on the Basin shape it turns that light green. However, when you click on "Tournai" or "Brussels" or any other point on the map it does not use the states option I have set.
Remember to set the allowPointSelect option to true on series - https://api.highcharts.com/highmaps/series.mappoint.allowPointSelect
If you want to change the point status on click the state options should be set on plotOptons.series.marker.states, not plotOptions.series.states,
Demo: https://jsfiddle.net/BlackLabel/wgqcL1ay/
plotOptions: {
series: {
marker: {
fillColor: '#FFFFFF',
lineWidth: 2,
lineColor: Highcharts.getOptions().colors[1],
states: {
select: {
fillColor: 'red',
radius: 12,
}
}
}
}
},
API: https://api.highcharts.com/highmaps/series.mappoint.marker.states.select
When I hover over a marker in a chart, how can I remove the larger opaque circle behind the marker.
Halo can be adjusted using options described in Highcharts API reference: http://api.highcharts.com/highcharts#plotOptions.line.states.hover.halo
Example:
plotOptions: {
series: {
states: {
hover: {
halo: {
size: 0
}
}
}
}
},
jsFiddle: http://jsfiddle.net/gujbp7qw/
When you hover on any point in highcharts graphs. The point is highlighted(zoomed). Is there a way to remove this effect and show the points as it is (like without hover) and the tooltip be shown?
Yes:
plotOptions: {
series: {
states: {
hover: {
enabled: false
}
}
}
}
http://api.highcharts.com/highcharts#plotOptions.series.states.hover.enabled
I've using Highcharts 2.3.5. In the "exporting' object, under "chartOptions", I'm able to change some things when exporting, like the background color of the chart, but I haven't been able to enable the dataLabels nor change the marker size.
Here's an example, of what works and doesn't work. In this case, when exporting, I want to change the background color (which works) and make sure the data labels appear (which doesn't work) :
...
exporting : {
chartOptions : {
chart: { backgroundColor: '#ff0000'}, //this works
plotOptions: {
pie : {
dataLabels: {enabled: true} //this one doesn't work
}
}
}...
Am I missing something obvious?
j
$('#container1').highcharts({
exporting: {
chartOptions: { // specific options for the exported image
plotOptions: {
series: {
dataLabels: {
enabled: true
}
}
}
},
scale: 3,
fallbackToExportServer: false
},