iOS Charts - How to set the y values under the x axis

Question

I'm using the danielgindi/Charts library and I'm trying to put the Y Value under the X axis.

At the moment I have this:

And I need this:

My code:

private func setupBarChart(){
    var barChart = BarChartView(frame: frame)
    barChartContainer.addSubview(barChart)

    let labels = ["Ericsson", "Siemens", "Huawei", "Ericsson", "Siemens"]

    barChartContainer.addConstraintsWithFormat("H:|[v0]|", views: barChart)
    barChartContainer.addConstraintsWithFormat("V:|[v0]|", views: barChart)

    let entry1 = BarChartDataEntry(x: 0, y: 3670)
    let set1 = BarChartDataSet(values: [entry1], label: labels[0])
    set1.setColor(UIColor.cnBlue)

    let entry2 = BarChartDataEntry(x: 1, y: 2292)
    let set2 = BarChartDataSet(values: [entry2], label: labels[1])
    set2.setColor(UIColor.cnBlue)

    let entry3 = BarChartDataEntry(x: 2, y: 3670)
    let set3 = BarChartDataSet(values: [entry3], label: labels[2])
    set3.setColor(UIColor.cnBlue)

    let entry4 = BarChartDataEntry(x: 3, y: 2292)
    let set4 = BarChartDataSet(values: [entry4], label: labels[3])
    set4.setColor(UIColor.cnBlue)

    let entry5 = BarChartDataEntry(x: 4, y: 675)
    let set5 = BarChartDataSet(values: [entry5], label: labels[4])
    set5.setColor(UIColor.cnBlue)

    let data = BarChartData(dataSets: [set1, set2, set3, set4, set5])

    barChart.data = data

    barChart.drawGridBackgroundEnabled = false
    barChart.drawValueAboveBarEnabled = false
    barChart.drawBordersEnabled = false
    barChart.legend.enabled = false
    barChart.chartDescription?.text = "Sites per technology"
    barChart.chartDescription?.textAlign = .center
    barChart.chartDescription?.position = CGPoint(x: barChartContainer.bounds.width/2, y: 0)

    barChart.xAxis.labelPosition = .bottom
    barChart.xAxis.drawGridLinesEnabled = false
    barChart.xAxis.wordWrapEnabled = true
    barChart.xAxis.labelFont = .cnFont(ofSize: 14, weight: .semibold)
    barChart.xAxis.valueFormatter = DefaultAxisValueFormatter(block: {(index, _) in
        return labels[Int(index)]
    })

    barChart.leftAxis.enabled = false
    barChart.rightAxis.enabled = false

    barChart.drawValueAboveBarEnabled = false
    barChart.doubleTapToZoomEnabled = false
    barChart.pinchZoomEnabled = false
    barChart.scaleXEnabled = false
    barChart.scaleYEnabled = false
    barChart.setExtraOffsets(left: 10, top: 10, right: 10, bottom: 10)
    barChart.fitBars = true

    barChart.animate(xAxisDuration: 1, yAxisDuration: 1, easingOption: .easeInOutCirc)
}

Do I have to make a custom AxisRenderer and if so can you give me some leads on this? I have been searching for examples but I still haven't been able to understand how to get what I need with the renderer.

Thank you in advance!

Answer 1

You can implement IAxisValueFormatter protocol this way

struct Label {
  var text: String
  var value: Double
}

public class DayAxisValueFormatter: NSObject, IAxisValueFormatter {

  var xToY = [Double: Label]()

  public func stringForValue(_ value: Double, axis: AxisBase?) -> String {    
    return "\(xToY[value]!.text ),\n\(xToY[value]!.value)"
  }

}

Then assign this formatter to x axis

let f = DayAxisValueFormatter(chart: chartView)
f.xToY = [
  0: Label(text: "Biemens", value: 6354),
  1: Label(text: "Siemens", value: 2344),
  2: Label(text: "Ericsson", value: 2345),
  3: Label(text: "Huawei", value: 5241),
  4: Label(text: "Shmericsson", value: 3525)
]
barChart.xAxis.valueFormatter = f