SwiftUI图表通过居中的AxisValueLabel截断了最后一个值

huangapple go评论69阅读模式
英文:

SwiftUI Charts cutting off last value with centered AxisValueLabel

问题

我正在使用新的 Swift 图表库,它的 X 轴数值对齐有点奇怪。当我指定 AxisValueLabel(centered: true) 时,最后一个数值被切掉(在这个例子中是 "December")。

如果我不指定 center=true,那么 X 轴数值会具有前导对齐,看起来不太对。

以下是用于图表的代码:

  1. struct graphOne: View {
  2. @ObservedObject var vm: CVVM
  3. @State private var position = 30
  4. var frameWidth = UIScreen.screenWidth
  5. var body: some View {
  6. Chart {
  7. ForEach(vm.currentUsage) { empRes in
  8. BarMark(
  9. x: .value("Month", empRes.date, unit: vm.filter),
  10. y: .value("energy", empRes.energyUsage)
  11. )
  12. //.foregroundStyle(.green)
  13. .annotation(position: .top) {
  14. Text("\(empRes.energyUsage)")
  15. .font(.caption)
  16. }
  17. .cornerRadius(5)
  18. }
  19. }
  20. .chartXAxis {
  21. AxisMarks(preset: .aligned, values: vm.currentUsage.map{ $0.date}) { date in
  22. AxisValueLabel(format: vm.chartType == "months" ? .dateTime.month() : .dateTime.day(), centered: true)
  23. }
  24. }
  25. .chartYAxis {
  26. AxisMarks(position: .leading)
  27. }
  28. .padding()
  29. .frame(width: frameWidth)
  30. }
  31. }

SwiftUI图表通过居中的AxisValueLabel截断了最后一个值

英文:

I am messing with the new swift charts library and its alignment is a little weird for the x values.
When i specify AxisValueLabel(centered: true) the last value gets cut off(December in this case).

If I dont specify center=true, then the x value has leading alignment and it just looks off.

code for graph

  1. struct graphOne: View {
  2. @ObservedObject var vm: CVVM
  3. @State private var position = 30
  4. var frameWidth = UIScreen.screenWidth
  5. var body: some View {
  6. Chart {
  7. ForEach(vm.currentUsage) { empRes in
  8. BarMark(
  9. x: .value("Month", empRes.date, unit: vm.filter),
  10. y: .value("energy", empRes.energyUsage)
  11. )
  12. //.foregroundStyle(.green)
  13. .annotation(position: .top) {
  14. Text("\(empRes.energyUsage)")
  15. .font(.caption)
  16. }
  17. .cornerRadius(5)
  18. }
  19. }
  20. .chartXAxis {
  21. AxisMarks(preset: .aligned, values: vm.currentUsage.map{ $0.date}) { date in
  22. AxisValueLabel(format: vm.chartType == "months" ? .dateTime.month() : .dateTime.day(), centerd: true)
  23. }
  24. }
  25. .chartYAxis {
  26. AxisMarks(position: .leading)
  27. }
  28. .padding()
  29. .frame(width: frameWidth )
  30. }
  31. }

SwiftUI图表通过居中的AxisValueLabel截断了最后一个值

答案1

得分: 0

在我发布的代码中,我在Chart{}上有一个修饰符

  1. .chartXAxis{}

在这个修饰符中,我有如下的AxisMarks

  1. .chartXAxis{
  2. AxisMarks(preset: .aligned....){}
  3. }

我在某个教程中找到了这个,当我删除preset: .aligned后,我的问题得以解决。

解决方案

  1. Chart{...}
  2. .chartXAxis{
  3. AxisMarks(...){}
  4. }

SwiftUI图表通过居中的AxisValueLabel截断了最后一个值

英文:

in the code I have posted I have a modifier on the Chart{} called

  1. .chartXAxis{}

within this modifier I have the AxisMarks as follows

  1. .chartXAxis{
  2. AxisMarks(preset: .aligned....){}
  3. }

I found that in a tutorial somewhere and didn't think much of it. After removing the preset: .aligned my issues were solved.

SOLUTION

  1. Chart{...}
  2. .chartXAxis{
  3. AxisMarks(...){}
  4. }

SwiftUI图表通过居中的AxisValueLabel截断了最后一个值

huangapple
  • 本文由 发表于 2023年2月18日 01:34:56
  • 转载请务必保留本文链接:https://go.coder-hub.com/75487523.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定