score:15
looks like it's not possible to do that from within the formatter
.
but you could set them after the chart is rendered (loaded). try something like this
$.each(chartobj.series[0].data, function(i, point) {
if(point.y > 100) {
point.datalabel.attr({x:20});
}
});
in the load callback
(or if you need it in the redraw callback
).
see example here.
score:0
i've been trying to figure some of this out myself... it looks like instead of
this.series.chart.options.plotoptions.bar.datalabels.x -= 20;
could you use...
this.series.options.datalabels.x = -20;
... at this point i'm trying to understand if i'm able to discern the location of a datalabel so that i can reposition it if necessary.
score:4
although bhesh's answer solves the problem for x/y positioning, highcharts ignores any changes to the style property of datalabels (see the problem here). however, you can override the styles of an individual point by passing it through the data object:
series: [{ data: [29.9, 106, { y: 135, datalabels: { style: { fontsize: 20 } } }]
i was able to get dynamic styles by iterating over my data before passing the whole object to highcharts to render.
score:6
here's what i ended up with. the settimeout is necessary or the datalabel property doesn't exist on the point:
formatter: function () {
var point = this.point;
window.settimeout(function () {
if (point.s < 0) {
point.datalabel.attr({
y: point.ploty + 20
});
}
});
//this.series.options.datalabels.y = -6;
var sty = this.point.s < 0 ? 'color:#d00' : 'color:#090;' //other style has no effect:(
return '<span style="' + sty + '">' + math.abs(this.point.s) + '</span>';
}
Source: stackoverflow.com
Related Query
- Is it possible to position Highcharts dataLabels depending on the value?
- put condition depending on the value HIGHCHARTS
- How to set Highcharts xAxis position on the yAxis zero value (negative/positive chart)?
- Position highcharts datalabels to the left of positive bars and to the right of negative bars
- HighCharts : Is it possible to customize the colors of individual series?
- How to display the value instead of percentage in a pie chart using jquery Highcharts
- How replicate the value of Y Axis on both sides of the axis in Highcharts
- Possible to connect the zoom on two Highcharts graphs?
- How do I get the value of a highcharts graph point on mouseover?
- Is it possible to hide the line & symbol next to Highcharts legend items?
- Is it possible to hide the navigator in highcharts at runtime?
- Is it possible to position the zoom buttons in highcharts/highstock?
- Fix Highcharts dataLabels to the bottom
- Getting the X Axis value in HighCharts
- In highcharts, is it possible get the exact position of x axis labels for overlap detection purpose?
- Is it possible in highcharts to have 2 charts, sharing the same x-axis, but next to one another?
- highcharts data labels overlaps the plotlines value
- yAxis tickinterval in highcharts is not working as per the value
- Is it possible to set Highcharts to hide tooltip when the mouse pointer is 30px away
- DataLabels in Highcharts are outside the container / not showing
- How to remove the value and number labels from Highcharts angular gauge
- HighCharts - Show categories in x axis intead of the value of x in Bubble Chart
- Highcharts show the same yAxis start and end value with multiple data series
- I had created a scatterplot using Highcharts but the the point.z value is not getting displayed in tooltip
- Setting highcharts datalabels backgroundColor with the same color of its serie
- how to display 2 same highcharts without duplicate the code
- Is there a way to change the display value in series using highcharts
- Is to possible to delay the needle loading animation in Highcharts angular gauge?
- Highcharts - position column chart from the top
- Change color code on colum, depending on data value (highchartJS)
More Query from same tag
- Highstocks component react error
- highcharts highmaps parsing json data to display world map with rich info
- Add Categories and Series dynamically from JSON in HighCharts
- Highcharts temperature legend
- How to remove margin from gauge chart in Highcharts?
- Highcharts Mysql Json arrays PHP
- Highcharts custom animation support
- Fill area beneath scatter points with color in Highcharts 3d scatter plot
- Show Indicator at last point on Highchart spline chart
- Boost Enable/Disabled with update Method in Highcharts
- Is there any way in Highcharts to auto show Labels/Text on a scatter chart?
- Display Date and time on highcharts
- How to hide 0 values in multi chart in highcharts?
- Draw multiple series upon mouse hover in Highstock
- Make dynamic Y-axis max value and tick interval of highchart using php
- Highlight border of plotband on mouseover
- How can I update the data in highcharts for both x axis & y axis?
- How to customize the label for navigator in highstock
- Highchart multiple threshold colors
- HighCharts: Reduce size of chart
- Highcharts line chart all points disappear when have more than one points with same X Axis
- jQplot with tooltip for the peak value?
- Highcharts clickhandler and accessing context
- JSON parse or removing double quotation in data getting form model or database in rails
- Gauge Speedometer
- Why doesn't dataGrouping.units work here?
- Custom button next to exporting overlaps on the To: of the range picker
- Draw Pie HighCharts from json value,
- Hide specific points in series
- Highcharts not plotting Date string as Category