ChartsOrg / ChartsOrg/Charts

LineChartView one x axis label color is bold and dark.

Open
#5,122 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Swift
Stars
28k
Forks
6k
PR merge metrics
No merged PRs in 30d

Description

* [x] I've read, understood, and done my best to follow the [*CONTRIBUTING guidelines](https://github.com/jjatie/Charts/blob/master/CONTRIBUTING.md).

## What did you do?

`

```
private func configureChart() {
guard chartView.superview == nil else { return }
chartViewContainer.addSubview(chartView)
chartView.snp.makeConstraints { make in
make.edges.equalToSuperview()
}

chartView.legend.enabled = false
chartView.extraBottomOffset = 15
chartView.xAxis.axisLineColor = UIColor.palmDarkBlue.withAlphaComponent(0.2)
chartView.xAxis.labelPosition = .bottom
chartView.xAxis.labelTextColor = .palmGrayTransparent
chartView.xAxis.gridColor = UIColor.lightGray.withAlphaComponent(0.5)
chartView.xAxis.gridLineDashPhase = 2
chartView.xAxis.gridLineDashLengths = [5]
var entries = [Double]()
for balance in self.balances {
let date = DateFormatter.justDate.date(from: balance.date)
entries.append(Double(Date(year: date!.year , month: date!.month, day: 1).ordinality(of: .day, in: .year)!))
}
chartView.xAxis.centerAxisLabelsEnabled = true
chartView.xAxis.centeredEntries = entries.map { $0 + 15 }
chartView.xAxis.entries = entries

chartView.leftAxis.drawAxisLineEnabled = false
chartView.leftAxis.drawZeroLineEnabled = false
chartView.leftAxis.drawGridLinesEnabled = false
chartView.leftAxis.drawLabelsEnabled = false

chartView.rightAxis.drawAxisLineEnabled = false
chartView.rightAxis.drawZeroLineEnabled = false
chartView.rightAxis.drawGridLinesEnabled = false
chartView.rightAxis.drawLabelsEnabled = false

chartView.pinchZoomEnabled = false
chartView.doubleTapToZoomEnabled = false
chartView.dragEnabled = true
chartView.delegate = self

chartView.marker = CircularMarker(outerCircleSize: CGSize(width: 14, height: 14),
outerCircleColor: UIColor(hex: "#16CA9C")!.withAlphaComponent(0.3),
innerCircleSize: CGSize(width: 8, height: 8),
innerCircleColor: .white)

let monthFormatter = DateFormatter()
monthFormatter.dateFormat = "MMM"
if let start = DateFormatter.justDate.date(from: self.balances[0].date) {
xAxisFormatter = MonthValueFormatter({
if let value = Calendar.current.date(byAdding: .day, value: $0 - 1, to: start) {
let monthString = monthFormatter.string(from: value)
return monthString
} else {
return ""
}
})
chartView.xAxis.valueFormatter = xAxisFormatter
chartView.xAxisRenderer = CustomXAxisRenderer(viewPortHandler: chartView.xAxisRenderer.viewPortHandler,
axis: (chartView.xAxisRenderer.axis),
transformer: chartView.xAxisRenderer.transformer)
}
}
```

````
func populateChart() {
var day = 1
let selected = DateFormatter.justDate.string(from: selectedDate)
var beforeSelected = [ChartDataEntry]()
var afterSelected = [ChartDataEntry]()
for value in balances {
let entry = ChartDataEntry(x: Double(day), y: Double(value.balance))
if value.date <= selected {
beforeSelected.append(entry)
} else {
afterSelected.append(entry)
}
day += 1
}

func styleDataSet(_ dataSet: LineChartDataSet) {
dataSet.fillAlpha = 1
dataSet.drawFilledEnabled = true
dataSet.drawCirclesEnabled = false
dataSet.drawHorizontalHighlightIndicatorEnabled = false
dataSet.drawVerticalHighlightIndicatorEnabled = true
dataSet.highlightLineDashLengths = [4]
dataSet.drawValuesEnabled = false
}

let beforeDataSet = LineChartDataSet(entries: beforeSelected)
beforeDataSet.colors = [chartGreen]
let beforeGradient = CGGradient(colorsSpace: nil,
colors: [ UIColor(red: 0.086, green: 0.792, blue: 0.612, alpha: 0.5).cgColor,
UIColor(red: 0.086, green: 0.792, blue: 0.612, alpha: 0).cgColor] as CFArray,
locations: [1, 0])!
beforeDataSet.fill = LinearGradientFill(gradient: beforeGradient, angle: 90)
beforeDataSet.highlightColor = chartGreen
styleDataSet(beforeDataSet)

let afterDataSet = LineChartDataSet(entries: afterSelected)
afterDataSet.colors = [chartGray]
let afterGradient = CGGradient(colorsSpace: nil,
colors: [ UIColor(red: 0.831, green: 0.859, blue: 0.878, alpha: 0.3).cgColor,
UIColor(red: 0.745, green: 0.788, blue: 0.816, alpha: 0).cgColor ] as CFArray,
locations: [1, 0])!
afterDataSet.fill = LinearGradientFill(gradient: afterGradient, angle: 90)
afterDataSet.highlightColor = chartGray
styleDataSet(afterDataSet)

let chartData = LineChartData(dataSets: [beforeDataSet, afterDataSet])
self.chartView.data = chartData
if !beforeDataSet.isEmpty {//LineChartView
selectedIndex = beforeDataSet.count - 1
chartView.highlightValue(.init(x: beforeDataSet.last!.x, y: beforeDataSet.last!.y, dataSetIndex: 0))
}
}
````

## What did you expect to happen?

ℹ All x axis labels should have same color.

## What happened instead?

ℹ One x axis label is in different font.
![linechart](https://github.com/danielgindi/Charts/assets/8969855/291aa272-02ac-49fd-969b-ced61cb2e477)

## DGCharts Environment

**DGCharts version/Branch/Commit Number:*DGCharts/Core (5.0.0)*
**Xcode version:*15.0*
**Swift version:*Swift 5.0*
**Platform(s) running DGCharts:*iPhone*
**macOS version running Xcode:*NONE*

## Demo Project

ℹ Please link to or upload a project we can download that reproduces the issue.

Contributor guide

Open the contributing guide

Research direction

Start with the reported configureChart() and populateChart() code, especially the CustomXAxisRenderer setup and xAxis label styling. Reproduce the chart on DGCharts 5.0.0 using the supplied configuration, then inspect how the renderer handles the highlighted label. Done means all x-axis labels render with the same color and font.

Written by the indexing model from the issue text.

Assessment

Tech stack
swift
Domain
mobile-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.