如何在Altair分面图中保持区域颜色一致？

Question

我希望保持我的阴影区域透明度足够高，以便看到下面的网格。这三个表面最终呈现出不同的灰度。我希望它们都像第一个一样看起来。示例：

import altair as alt
from vega_datasets import data

source = data.cars()
source['Start'] = 100
source['Middle'] = 175
source['End'] = 250

cars = alt.Chart(source).mark_circle(size=100).encode(
    x=alt.X("Horsepower:Q"),
    y=alt.Y("Miles_per_Gallon:Q"),
    color=alt.Color('Weight_in_lbs:Q'))

area1 = alt.Chart(source).mark_rect(color='#696969',opacity=0.005).encode(
    x=alt.X('Start'), 
    x2='Middle', 
    y=alt.value(0), 
    y2=alt.value(300))

area2 = alt.Chart(source).mark_rect(color='#696969',opacity=0.01).encode(
    x=alt.X('Middle'),
    x2='End',
    y=alt.value(0), 
    y2=alt.value(300))
  
(area1+area2+cars).properties(height=300, width=300
).facet(alt.Column('Origin:N'))

输出：

- pray4shell

Answer 1

问题在于每行都有开始/中间/结束值，因此您正在堆叠每个小面的一个半透明矩形。由于不同小面具有不同数量的点，因此矩形数量不同，形成的阴影颜色较暗或较浅。

最简单的解决方法是使用聚合函数，在每个面板上绘制一个矩形：

import altair as alt
from vega_datasets import data

source = data.cars()
source['Start'] = 100
source['Middle'] = 175
source['End'] = 250

cars = alt.Chart(source).mark_circle(size=100).encode(
    x=alt.X("Horsepower:Q"),
    y=alt.Y("Miles_per_Gallon:Q"),
    color=alt.Color('Weight_in_lbs:Q'))

area1 = alt.Chart(source).mark_rect(color='#696969',opacity=0.1).encode(
    x='min(Start)', 
    x2='min(Middle)', 
    y=alt.value(0), 
    y2=alt.value(300))

area2 = alt.Chart(source).mark_rect(color='#696969',opacity=0.2).encode(
    x='min(Middle)',
    x2='min(End)',
    y=alt.value(0), 
    y2=alt.value(300))
  
(area1+area2+cars).properties(height=300, width=300
).facet(alt.Column('Origin:N'))

- jakevdp