Карта Альтаира mark_text цвет фона/визуальная четкость ⇐ Python

[Anonymous]

Я экспериментировал с диаграммами Альтаира в контексте Streamlit для создания простых калькуляторов. В одном случае я хотел построить три гистограммы рядом друг с другом, чтобы объяснить, как работают шкалы прогрессивного налогообложения.
В одном столбце указан общий доход, в следующем – столбец. проводится между началом группы и точкой, в которой ставка выплачивается за эту группу. Наконец, я складываю все эти интервалы вместе, чтобы получить общую сумму налога.
[img]https://i.sstatic. net/pRAiElfg.png[/img]

Я не могу придумать хороший способ сделать так, чтобы число «Общая задолженность» не конфликтовало визуально с линиями сетки. Частично это связано с тем, что я не могу найти хороший способ связать отображаемый размер диаграммы с размером шрифта, чтобы выполнять условные проверки на предмет перекрытия. Я также считаю, что невозможно контролировать отображение линий сетки для каждого столбца.
В идеале я хочу, чтобы линии сетки были толстыми и видимыми, не нарушая при этом текст. Я мог бы разместить текст этого столбца внутри столбцов, расположенных друг над другом, но в некоторых конфигурациях разноцветные столбцы делают текст нечитаемым.
Вот MRE:

Код: Выделить всё

import altair as alt
import pandas as pd
import streamlit as st

# Example data
data = pd.DataFrame({
'category': ['A', 'B', 'C', 'D'],
'value': [10, 20, 15, 25]
})

# Base chart with gridlines
chart = alt.Chart(data).mark_bar().encode(
x='value:Q',
y=alt.Y('category:N', axis=alt.Axis(grid=True, gridWidth=2, gridColor='darkslategray'))
)

text = alt.Chart(data).mark_text(
align='left',
baseline='middle',
color='black'
).encode(
x='value:Q',
y='category:N',
text=alt.Text('value:Q')
)

# Combine the charts
final_chart = chart + text

st.altair_chart(final_chart)

Я попробовал использовать mark_rect в качестве фона для текста, добавив этот фрагмент к приведенному выше:

Код: Выделить всё

# Text with background
text_background = alt.Chart(data).mark_rect(
color='black',
opacity=0.7,
height=20,
width=20
).encode(
x='value:Q',
y='category:N'
)

и обновление состава итоговой диаграммы. Однако эти прямоугольники центрированы на конце полосы и (опять же) без возможности связать размер диаграммы и размер шрифта текста. Я не вижу простого способа центрировать его по тексту (или даже установить соответствующую ширину для охватывать весь текст в зависимости от его ширины).


Есть ли удобный способ сделать это? В противном случае, есть ли другая библиотека диаграмм, которую я мог бы использовать?

Подробнее здесь: https://stackoverflow.com/questions/792 ... al-clarity