:orphan:
:html_theme.sidebar_secondary.remove:

.. This document is auto-generated by the altair-gallery extension. Do not modify directly.

.. _gallery_us_population_pyramid_over_time:


US Population Pyramid Over Time
===============================
A population pyramid shows the distribution of age groups within a population.
It uses a slider widget that is bound to the year to visualize the age
distribution over time.


.. altair-plot::
    :remove-code:
    


    import altair as alt
    from vega_datasets import data

    source = data.population.url

    slider = alt.binding_range(min=1850, max=2000, step=10)
    select_year = alt.selection_point(name='year', fields=['year'],
                                       bind=slider, value={'year': 2000})

    base = alt.Chart(source).add_params(
        select_year
    ).transform_filter(
        select_year
    ).transform_calculate(
        gender=alt.expr.if_(alt.datum.sex == 1, 'Male', 'Female')
    ).properties(
        width=250
    )


    color_scale = alt.Scale(domain=['Male', 'Female'],
                            range=['#1f77b4', '#e377c2'])

    left = base.transform_filter(
        alt.datum.gender == 'Female'
    ).encode(
        y=alt.Y('age:O', axis=None),
        x=alt.X('sum(people):Q',
                title='population',
                sort=alt.SortOrder('descending')),
        color=alt.Color('gender:N', scale=color_scale, legend=None)
    ).mark_bar().properties(title='Female')

    middle = base.encode(
        y=alt.Y('age:O', axis=None),
        text=alt.Text('age:Q'),
    ).mark_text().properties(width=20)

    right = base.transform_filter(
        alt.datum.gender == 'Male'
    ).encode(
        y=alt.Y('age:O', axis=None),
        x=alt.X('sum(people):Q', title='population'),
        color=alt.Color('gender:N', scale=color_scale, legend=None)
    ).mark_bar().properties(title='Male')

    alt.concat(left, middle, right, spacing=5)


.. tab-set::

    .. tab-item:: Method syntax
        :sync: method

        .. code:: python


            import altair as alt
            from vega_datasets import data

            source = data.population.url

            slider = alt.binding_range(min=1850, max=2000, step=10)
            select_year = alt.selection_point(name='year', fields=['year'],
                                               bind=slider, value={'year': 2000})

            base = alt.Chart(source).add_params(
                select_year
            ).transform_filter(
                select_year
            ).transform_calculate(
                gender=alt.expr.if_(alt.datum.sex == 1, 'Male', 'Female')
            ).properties(
                width=250
            )


            color_scale = alt.Scale(domain=['Male', 'Female'],
                                    range=['#1f77b4', '#e377c2'])

            left = base.transform_filter(
                alt.datum.gender == 'Female'
            ).encode(
                alt.Y('age:O').axis(None),
                alt.X('sum(people):Q')
                    .title('population')
                    .sort('descending'),
                alt.Color('gender:N')
                    .scale(color_scale)
                    .legend(None)
            ).mark_bar().properties(title='Female')

            middle = base.encode(
                alt.Y('age:O').axis(None),
                alt.Text('age:Q'),
            ).mark_text().properties(width=20)

            right = base.transform_filter(
                alt.datum.gender == 'Male'
            ).encode(
                alt.Y('age:O').axis(None),
                alt.X('sum(people):Q').title('population'),
                alt.Color('gender:N').scale(color_scale).legend(None)
            ).mark_bar().properties(title='Male')

            alt.concat(left, middle, right, spacing=5)


    .. tab-item:: Attribute syntax
        :sync: attribute

        .. code:: python


            import altair as alt
            from vega_datasets import data

            source = data.population.url

            slider = alt.binding_range(min=1850, max=2000, step=10)
            select_year = alt.selection_point(name='year', fields=['year'],
                                               bind=slider, value={'year': 2000})

            base = alt.Chart(source).add_params(
                select_year
            ).transform_filter(
                select_year
            ).transform_calculate(
                gender=alt.expr.if_(alt.datum.sex == 1, 'Male', 'Female')
            ).properties(
                width=250
            )


            color_scale = alt.Scale(domain=['Male', 'Female'],
                                    range=['#1f77b4', '#e377c2'])

            left = base.transform_filter(
                alt.datum.gender == 'Female'
            ).encode(
                y=alt.Y('age:O', axis=None),
                x=alt.X('sum(people):Q',
                        title='population',
                        sort=alt.SortOrder('descending')),
                color=alt.Color('gender:N', scale=color_scale, legend=None)
            ).mark_bar().properties(title='Female')

            middle = base.encode(
                y=alt.Y('age:O', axis=None),
                text=alt.Text('age:Q'),
            ).mark_text().properties(width=20)

            right = base.transform_filter(
                alt.datum.gender == 'Male'
            ).encode(
                y=alt.Y('age:O', axis=None),
                x=alt.X('sum(people):Q', title='population'),
                color=alt.Color('gender:N', scale=color_scale, legend=None)
            ).mark_bar().properties(title='Male')

            alt.concat(left, middle, right, spacing=5)