SwiftUI Charts, как избежать автоматической группировки элементов доступности на графике
У меня есть диаграмма BarMark, и я использую .accessibilityLabel и .accessibilityValue, чтобы настроить текст доступности для каждого столбца. При небольшом количестве полос на графике эта логика работает нормально, но когда полосок больше, они автоматически группируются и портят доступность текста. Интересно, можно ли как-нибудь избежать этой автоматической группировки?
Это мой код
var body: some View {
let salesData: [(Date, Double)] = [
(Date().addingTimeInterval(-1 * 24 * 60 * 60), 120),
(Date().addingTimeInterval(-2 * 24 * 60 * 60), 150),
(Date().addingTimeInterval(-3 * 24 * 60 * 60), 100),
(Date().addingTimeInterval(-4 * 24 * 60 * 60), 50),
(Date().addingTimeInterval(-5 * 24 * 60 * 60), 150),
(Date().addingTimeInterval(-6 * 24 * 60 * 60), 140),
(Date().addingTimeInterval(-7 * 24 * 60 * 60), 130),
(Date().addingTimeInterval(-8 * 24 * 60 * 60), 180),
(Date().addingTimeInterval(-9 * 24 * 60 * 60), 50),
(Date().addingTimeInterval(-10 * 24 * 60 * 60), 80),
(Date().addingTimeInterval(-11 * 24 * 60 * 60), 80),
(Date().addingTimeInterval(-12 * 24 * 60 * 60), 100),
(Date().addingTimeInterval(-13 * 24 * 60 * 60), 150),
(Date().addingTimeInterval(-14 * 24 * 60 * 60), 150),
(Date().addingTimeInterval(-15 * 24 * 60 * 60), 90),
]
Chart {
ForEach(salesData, id: \.0) { date, sales in
BarMark(
x: .value("Day", date),
y: .value("Amount", sales)
).accessibilityLabel(date.formatted(date: .abbreviated, time: .omitted))
.accessibilityValue("Amount: \(sales.formatted(.currency(code: "USD")))")
}
}
.accessibilityElement(children: .contain)
.frame(height: 300)
}
При запуске специальных возможностей он автоматически группирует 2 столбца в один элемент.
Я не уверен, есть ли какая-либо настройка, позволяющая избежать этой автоматической группировки, мне нужно поведение, подобное диаграмме активности в приложении «Здоровье».
к сожалению, мое требование показывает данные за целый месяц
@HuyVu с той же проблемой
Ответы 1
Кажется, что группировка работает нормально, если значения x форматируются как строки, а не оставляют значения x как даты:
x: .value("Day", date.formatted(date: .abbreviated , time: .omitted)),
Затем можно выбрать один день:
Внесение этого одного изменения повлекло за собой другие изменения, которые вы, возможно, захотите откорректировать. Поскольку значения x являются строками, порядок отображения — это порядок массива, а не порядок дат.
Исправление меток: дата каждого дня теперь отображается вдоль оси X. Ниже приведено исправление для этих сжатых меток, которые нужно добавить в диаграмму:
.chartXAxis(content: {
AxisMarks { value in
AxisValueLabel (orientation: .vertical) {
if let displayValue = value.as(String.self) {
Text(displayValue)
}
}
}
})
Большое спасибо, @Марси! Это именно то, что мне нужно
Кажется, ваш код работает нормально с данными за 12 или менее дней. Возможно, стоит подумать о составлении графика за неделю или предыдущие 10 дней.