score:2
It feels more like a hack than a genuine solution, but I have come up with a workaround that solves my issue for now, I have the function below:
var labelBackground = null;
function labelDrawBack(crt) {
if ( isIntraDay ) {
var textbox = crt.yAxis[ 0 ].plotLinesAndBands[ 0 ].label;
if ( !!labelBackground ) {
labelBackground.attr({ y: textbox.y - 10 });
} else {
var box = textbox.getBBox();
labelBackground = crt.renderer.rect( box.x - 3, box.y + 1, box.width + 6, box.height, 3 ).attr( {
fill: '#fff',
id: 'labelBack',
opacity: .65,
'stroke-width': 0,
zIndex: 4
}).add();
}
}
}
I make sure this function is executed immediately after the chart is initialized and additionally I attach the function to the chart object that is returned from the StockChart call:
var chartObj = new Highcharts.StockChart( chartConfig, function ( crt ) {
labelDrawBack( crt );
} );
chartObj.labelDraw = labelDrawBack;
And in the chart options I have added this to the chart.redraw event:
events: {
redraw: function() {
this.labelDraw(this);
}
}
This works as intended, moving the transparent background with the label (which is moved vertically when the chart is resized). The reason I have redirected the call in the chart redraw event is that the labelDrawBack function is defined in another function than the one where my chart options are defined, thus the labelDrawBack function is out of scope there.
Source: stackoverflow.com
Related Query
- How to draw a background behind a plotLine label in a highstock chart
- How to set the background of clicked or selected label on y axis gantt chart Highcharts?
- how can I move yAxis labels from Right of chart to left of chart in highstock
- How to create a new Highstock chart with new Highchart and not jquery?
- How to add a plotline to a bar chart in Highcharts?
- In high chart how to add event for label click
- Highcharts: how to set legend label name after chart created?
- How to change axis label size when exporting in Highcharts / Highstock
- How to set default range selected on chart draw in Highcharts/Highstock
- How to extract the data from highstock chart
- How to control HightChart Pie Chart/Donut Chart label font-weight in config
- How to hide highChart plotLine label until mouseover?
- Highcharts Bubble Chart - How to move an individual point's data label (dataLabel) to the front/top
- How do I make the label in polar chart not get split automatically?
- How to draw the below chart using highchart?
- HighCharts: How to display unique text for yAxis Label in a spline chart
- Set background color for only one pane in multi-pane Highstock chart
- How to give background color to selected x-axis label in highcarts gantt
- How to change the background color of measure tool in stock chart in highstock?
- how to take only categories for x-axis and remove unwanted scaling in Highstock chart
- Spiderweb chart with circular gridline interpolation: Label is seen very far away from Plotline
- How to save and restore and Highstock chart with indicators?
- how to dynamically change chart type in highstock stock chart?
- Highcharts: How to align text label middle center of pie chart
- How to draw a bar chart that one series has both positive and negative values in Highcharts?
- How to create pie chart with only 1 series data and have background be a circle
- How can I style my highcharts solid gauge to have a background behind the percentage?
- Highcharts display label for pie chart using html table as data source
- How to use click event on Y-axis label in angular Gantt chart High Chart
- Highcharts: how to draw line segments with click-and-drag and without chart to scroll?
More Query from same tag
- Plot one point on Highcharts JS graph according to x-axis?
- PhantomJS's limit for PNG generation with an Hightchart JSON document(3DOption enable)
- Formatting Highchart bar charts axis labels
- Highcharts datepicker - multiple series
- Adding images to tooltips in Highmaps
- How to replace label line with dot in highcharts
- X-axis category name from string in series list
- How to use tickPositioner, to have different distance between lines of grid (Yaxis)?
- Graphics start from axis + grid line
- Adding thousands separator for custom formatted highcharts tooltip
- How to dynamically add point placement and point padding in fixed column chart (highcharts)
- Highcharts - second y axis and plotlines in x and y directions
- Highcharts - Column With Negative Values - Column Color
- Highstock/Highchart scatter points in combined graph
- data not getting displayed/plotted in highchart
- highcharts- stacked bar, how can I make the chart cover the width 100%?
- JSON and Highcharts
- Gradient fill for guage - Highcharts
- highcharts / node-export-server: Blank charts with large data sets
- HighCharts Tooltip AJAX request onmouseover Event
- Highstock 1.3 afterSetExtremes throttling
- highcharts.js and highstock.js conflict
- How to redraw text rendered using SVGRenderer in Highcharts React?
- How would I convert this array to this json format
- How to apply custom color on candlesticks based on OPEN/CLOSE values?
- Highcharts Marimekko chart refresh
- How to data-table show name from series in xAxis
- HighCharts: How to change style of bottom most x-axis grid line
- Nested column chart with drilldown
- Highcharts Pie chart not accepting values