Search code examples
iosswiftbar-chartios-charts

How to remove extra line at the bottom of bar chart using ios charts?

Using Charts library I would like to get a specific look on the second photo. What I'm able to accomplish as of now was the one at the top image. I know I'm still too far from accomplishing the right one.

This is the implementation that I have for https://github.com/danielgindi/Charts as of this moment. I'm still exploring the Charts features though.

    var dataEntries: [BarChartDataEntry] = []

    let dataEntry1 = BarChartDataEntry(x: Double(0), y: Double(26))
    dataEntries.append(dataEntry1)
    let dataEntry2 = BarChartDataEntry(x: Double(1), y: Double(0))
    dataEntries.append(dataEntry2)
    let dataEntry3 = BarChartDataEntry(x: Double(2), y: Double(2))
    dataEntries.append(dataEntry3)

    let chartDataSet = BarChartDataSet(values: dataEntries, label: nil)// BarChartDataSet(values: dataEntries, label: "A")
    chartDataSet.setColor(.red)

    let chartData = BarChartData(dataSet: chartDataSet)
    chartData.barWidth = Double(0.3)

    barChart.data = chartData
    barChart.fitBars = true
    barChart.zoomOut()

    barChart.xAxis.drawGridLinesEnabled = false // disable horizontal grid lines

    barChart.scaleYEnabled = true
    barChart.scaleXEnabled = true

    let description = Description()
    description.text = ""
    barChart.chartDescription = description

    let labels = ["1-30 days", "31-60 days", "61+ days"]
    barChart.xAxis.valueFormatter = IndexAxisValueFormatter(values: labels)
    barChart.xAxis.granularity = 1.0
    barChart.xAxis.granularityEnabled = true
    barChart.xAxis.labelPosition = .bottom

    barChart.drawValueAboveBarEnabled = false

Specifically what I still lack as of now is a way to remove the extra line at the bottom and at the right bounds of the bar chart.

Current look:

current look

Target Look:

target look

UPDATE: barChart.rightAxis.enabled = false // removes the right labels

I still have to find a way to remove the one marked blue at the image, and have the bottom labels go near the box.

image with mark on which to remove UPDATE: I was able to make the xAxis labels just right where I want them to be by positioning them with .bottomInside

barChart.xAxis.labelPosition = .bottomInside

updated look:

enter image description here

What's left is getting rid of that last bottom square but keeping the label.

This: removes the whole bottom square including the labels. barChart.xAxis.labelPosition = .bottomInside

Solution

  • I was finally able to solve my problem. The thing that happened on my code is that my barChart.leftAxis.minimum is off by default.

    By setting it to 0, I was able to get the look I want.

    barChart.leftAxis.axisMinimum = 0.0