Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to hide axis lines but show ticks in a chart in Altair, while actively using "axis" parameter?

I am aware of using axis=None to hide axis lines. But when you have actively used axis to modify the graph, is it possible to keep just the ticks, but hide the axis lines for both X and Y axis?

For example, here is a graph I have where I'd like it to happen -

import pandas as pd
import altair as alt

df = pd.DataFrame({'a': [1,2,3,4], 'b':[2000,4000,6000,8000]})

alt.Chart(df).mark_trail().encode(
    x=alt.X('a:Q', axis=alt.Axis(titleFontSize=12, title='Time →', labelColor='#999999', titleColor='#999999', titleAlign='right', titleAnchor='end', titleY=-30)),
    y=alt.Y('b:Q', axis=alt.Axis(format="$s", tickCount=3, titleFontSize=12, title='Cost →', labelColor='#999999', titleColor='#999999', titleAnchor='end')),
    size=alt.Size('b:Q', legend=None)
).configure_view(strokeWidth=0).configure_axis(grid=False)

The output should look like the ticks in this SO post.
Note: The plot in that post has nothing to do with the demo provided here. its just for understanding purposes.

like image 650
jar Avatar asked Jul 08 '20 15:07

jar


People also ask

How do I get rid of gridlines on Altair?

We can remove the grid lines on x or y-axis by specifying the argument grid=False inside alt. X() or alt. Y() method in the encoding channels.

How do I remove the legend from Altair?

You can remove the legend entirely by submitting a null value.


1 Answers

Vega-Lite calls the axis line the domain. You can hide it by passing domain=False to the axis configuration:

import pandas as pd
import altair as alt

df = pd.DataFrame({'a': [1,2,3,4], 'b':[2000,4000,6000,8000]})

alt.Chart(df).mark_trail().encode(
    x=alt.X('a:Q', axis=alt.Axis(titleFontSize=12, title='Time →', labelColor='#999999', titleColor='#999999', titleAlign='right', titleAnchor='end', titleY=-30)),
    y=alt.Y('b:Q', axis=alt.Axis(format="$s", tickCount=3, titleFontSize=12, title='Cost →', labelColor='#999999', titleColor='#999999', titleAnchor='end')),
    size=alt.Size('b:Q', legend=None)
).configure_view(strokeWidth=0).configure_axis(grid=False, domain=False)

enter image description here

like image 88
jakevdp Avatar answered Oct 19 '22 18:10

jakevdp