uber
How to add labels to multiple vertical bar series?
Label series need x and y values to show labels. I am trying to add labels at plot that has multiple vertical bar series that has same xAxis values. The XYPlot shows labels at same vertical line if the x values are same. I used xOffset to show second labels where I want but xOffset is not stabil. How can I show labels with multiple vertical bar series correctly?
Hello, I was facing a similar issue and came up with a solution that worked for me. The easiest way I could find was calculating the bar width in pixels. My formula looks like:
const barWidthInPixels = (this.state.windowWidth - leftMargin) * barWidth / (numBars * numBarsPerX);
where leftMargin is the margin I set in the XYPlot in pixels, barWidth is the value I enter in the barWidth prop for each VerticalBarSeries, windowWidth is the width of the chart, numBars is the number of x values, and numBarsPerX is the number of bars displayed for each x tick (in your case 2).
Based on this value you can then dynamically set the xOffset for the labels. Obviously this will change slightly if you have other margins and offsets, but this seemed to work. If there's any easier way to get the barWidth in pixels I'd be interested. Cheers!
