Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Change position of data labels to bottom of the line in ios charts #4195

Closed
novinfard opened this issue Oct 26, 2019 · 1 comment
Closed

Comments

@novinfard
Copy link

I have two datasets and I want to set the position of data labels in one of the dataset to the bottom of the line, so the numbers can be visible and no overlapping happens. How can I do this?

Screenshot 2019-10-26 at 02 01 39

I setup the chart as follows:

private func configureChart() {
    lineChartView = LineChartView(frame: CGRect(x: 0, y: 60, width: self.view.frame.width, height: 200))

    lineChartView?.delegate = self

    lineChartView?.chartDescription?.enabled = false
    lineChartView?.dragEnabled = true
    lineChartView?.setScaleEnabled(false)
    lineChartView?.pinchZoomEnabled = false
    lineChartView?.rightAxis.enabled = false

    lineChartView?.xAxis.valueFormatter = self
    lineChartView?.xAxis.granularity = 1

    lineChartView?.legend.form = .line

    lineChartView?.animate(yAxisDuration: 0.3)

    if let lineChartView = lineChartView {
        dashboardHeaderView?.subviews.filter({ $0 is LineChartView }).forEach {
            $0.removeFromSuperview()
        }
        dashboardHeaderView?.addSubview(lineChartView)
    }
    setupLineChartData()
}

func setupLineChartData() {
    monthData = ReportModel.monthlyOveralInfo()
    let costSet = self.provideLineData(type: .totalCost)
    let incomeSet = self.provideLineData(type: .totalIncome)

    let lineChartData = LineChartData(dataSets: [incomeSet, costSet])
    lineChartView?.data = lineChartData
    lineChartView?.setVisibleXRangeMaximum(5)
    lineChartView?.moveViewToX(lineChartView?.chartXMax ?? 0)
}

private func provideLineData(type: SWMonthlyOverallType) -> LineChartDataSet {
    var mainColor: UIColor = .black
    var gradientFirstColor: UIColor = .clear
    var gradientSecondColor: UIColor = .black
    if type == .totalIncome {
        mainColor = .myAppGreen
        gradientFirstColor = .clear
        gradientSecondColor = .myAppGreen
    }

    let totalCosts = monthData.compactMap({
        $0.items.first(where: {$0.type == type})
    })

    var index: Double = -1
    let values: [ChartDataEntry] = totalCosts.compactMap({
        index += 1
        return ChartDataEntry(x: index, y: $0.value)
    })

    let chartDataSet = LineChartDataSet(values: values, label: type.rawValue)
    chartDataSet.resetColors()
    chartDataSet.drawIconsEnabled = false

    chartDataSet.setColor(mainColor)
    chartDataSet.setCircleColor(mainColor)
    chartDataSet.lineWidth = 1
    chartDataSet.circleRadius = 3
    chartDataSet.drawCircleHoleEnabled = true
    chartDataSet.valueFont = .systemFont(ofSize: 9)

    let gradientColors = [gradientFirstColor.cgColor,
                          gradientSecondColor.cgColor]
    let gradient = CGGradient(colorsSpace: nil, colors: gradientColors as CFArray, locations: nil)

    chartDataSet.fillAlpha = 0.5
    if let gradient = gradient {
        chartDataSet.fill = Fill(linearGradient: gradient, angle: 90)
    }
    chartDataSet.drawFilledEnabled = true

    return chartDataSet
}
@liuxuan30
Copy link
Member

you can only adjust the label count, and set a custom min/range, or don't display axis labels and use ChartLimitLine to display the value you want.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants