offset goes wrong when using mutiple bar chart in combined chart

[chandni-solanki]

I've used a CombinedChartView which has chartdata & linedata. The chartdata is grouped but the xAxis labels are not in sync with bars.

Here is the same issue which is already closed : #1566

I have used @sree127 solutions but it is not working with me. The labels are repeating and they are not matches with bars.

Can anybody help me?

Thanks.

[liuxuan30]

I don't see this happens in ChartsDemo. Would you check ChartsDemo - combined chart and turn on xAxis.centerAxisLabelsEnabled = YES;?

[chandni-solanki]

My code is :

let xAxis : XAxis = combinedChart.xAxis
xAxis.labelFont = UIFont.systemFont(ofSize: 9.0)
xAxis.granularity = 1.0

    xAxis.labelPosition = .bottom
    xAxis.centerAxisLabelsEnabled = true
    xAxis.avoidFirstLastClippingEnabled = true
    xAxis.drawGridLinesEnabled = false
    xAxis.valueFormatter = self
    xAxis.labelCount = 12
    xAxis.spaceMin = 2.0
    xAxis.spaceMax = 4.0

Now what I found is, When I set granularity = 0.0, The app is working fine but with repeating values. But when I changed granularity = 1.0 and combinedChart.xAxis.axisMinimum = 0.0 combinedChart.xAxis.axisMaximum = 11 + 0.45, The app is crashing with fatal error: Index out of range

Not getting what is the issue.

[liuxuan30]

don't mix up different issues in one thread.

For the issue in this thread, it's about how you define the granularity, and how you format your axis labels to avoid duplicated 'Oct'.

The alignment issue I don't see in ChartsDemo, so I would guess you should put chartView.data = chartData at last, or call notifyDataSetChanged() after you change ANY chart view property.

The crash issue, please paste the log where it crashes not just a wild 'index out of range'.

Also, do check computeAxisvalues() to see how granularity is used.

[adrianstanciu24]

I am having the same issue. From what I saw inside computeAxisValues() this happens when interval is set to 1.

        // Find out how much spacing (in y value space) between axis values
        let rawInterval = range / Double(labelCount) // range = 6.5, labelCount = 6
        var interval = ChartUtils.roundToNextSignificant(number: Double(rawInterval)) // rawInterval = 1.08333333

After this:

            if axis.centerAxisLabelsEnabled
            {
                first -= interval
            }

This causes first to become -1 which is then added to the entries list.

var f = first
axis.entries.append(Double(f))

In the ChartsDemo project I cannot reproduce this, even if f will be negative, because stringForValue is not used.

Someone has any suggestions ?

[codingspark]

Just want to share my experience, I solved this issue using a dynamic granularity, make chart adjust while zooming

Important do not force labelCount

First I have many datasets, so I group datasets values using

let groupSpace = 0.4
let barSpace = 0.03
let barWidth = 0.2

data.barWidth = barWidth
          
chart.xAxis.axisMinimum = 0.0
chart.xAxis.axisMaximum = 0.0 + data.groupWidth(groupSpace: groupSpace, barSpace: barSpace) * Double(labels.count)
          
data.groupBars(fromX: 0.0, groupSpace: groupSpace, barSpace: barSpace)

Adjust granularity base on how many columns you want to see
chart.xAxis.granularity = chart.xAxis.axisMaximum / Double(labels.count)

Then set data
chart.data = data

Then I use a custom Formatter to calculate label to be shown

class CustomLabelsAxisValueFormatter : NSObject, IAxisValueFormatter {
    
    var labels: [String] = []
    
    func stringForValue(_ value: Double, axis: AxisBase?) -> String {
        
        let count = self.labels.count
        
        guard let axis = axis, count > 0 else {
            
            return ""
        }
        
        let factor = axis.axisMaximum / Double(count)
        
        let index = Int((value / factor).rounded())
        
        if index >= 0 && index < count {
            
            return self.labels[index]
        }
        
        return ""
    }
}

Set the custom formatter

let formatter = CustomLabelsAxisValueFormatter()
formatter.labels = xVals
chart.xAxis.valueFormatter = formatter

Try and let me know. Happy coding!

[liuxuan30]

Hey @samueleperricone, thanks for your help, but don't post same code for different issues, they may not be related.

[monkeyRing]

the mutiple bar chart xAxis offset goes wrong

i have the same problem. @liuxuan30 i need your help .

   The  IAxisValueFormatter

    func stringForValue(_ value: Double, axis: AxisBase?) -> String {
        
        if let c = xValus?.count , c > 0 {
            if value > 0 {
                return xValus![Int(value) % xValus!.count]
            }
            return ""
        }
        return ""
    }

the xValus's value are like ["2016-11-12","2016-11-13","2016-11-14",...] ,it's string type

        let groupSpace = 0.08
        let barSpace = 0.1
        let barWidth = 0.3
        barData.barWidth = barWidth
        
        barChartView.xAxis.granularity = 1
        barChartView.xAxis.axisMinimum = 0
        barChartView.xAxis.axisMaximum = 0 + barData.groupWidth(groupSpace: groupSpace, barSpace: barSpace) * Double(times.count)
        barData.groupBars(fromX: 0, groupSpace: groupSpace, barSpace: barSpace)
        barChartView.data = barData
        barChartView.setVisibleXRangeMinimum(5)
        barChartView.animate(yAxisDuration: 0.5)

[liuxuan30]

It has been sometime.. I don't recall. but if it's about grouped bars, before calling groupBars, make sure (baSpace + barWidth) * dataSet count + groupSpace = 1.0. Can you try?
Also, you need to debug your formatter to make sure it fetch the correct one.

[monkeyRing]

@liuxuan30

I just changed the (baSpace + barWidth) * dataSet count + groupSpace = 1.0 rules to make sure they are summed to 1. It seems to be a bit normal, but the first xAxisLabel is not displayed, then the xAxisLabel is shifted a bit to the right.

the first xAxisLabel is not displayed . in other word , i want to the xAxisLabel for the firstIndex begin. Do you have some ideas ?

[monkeyRing]

@liuxuan30

this another issue :

[liuxuan30]

I see. there are two issues:

1. first label not appear
2. x axis label not align

Usually, please don't ask irrelevant question in one thread.

for 1, you have to take a look at computeAxisValues() first to see if the first x label value is generated (this xAxis.entries are the numbers you used for formatting index), then if it's there, you have to look at when rendering in xAxis renderer's drawLabels(), whether the first label is not beyond. I remember there is a switch avoidFirstLastBeingClipped for it. Because your label width is not that small, it might got cut off in drawLabels().

for 2, it looks to me you didn't use centerAxisLabelsEnabled

[monkeyRing]

@liuxuan30

thx your help me very much .
the first issue and second issue has been sloved.

now , it's only one last issue :

[liuxuan30]

I don't know what it is. And you should stop asking here..

[sagarsukode]

@codingspark : Thank you so much for your answer on this issue. Your code works like charm. Neat, clean & clear answer. Really appreciated.