Altair: Change language of timeline-stripplot

Created on 26 Feb 2018  路  31Comments  路  Source: altair-viz/altair

Hey dear all,

I really love what you guys provide with Altair and it is a lot of fun to play around with it. I was wondering, if there is a way to change ticks on a timeline-stripplot into another languages datetime-format (in my case German). I have tried just changing the locale but that had no effect on the graph. Is there a way to custom-map axis ticks from the data-values in the dataset to something converted without the order of the ticks being scrambled up?

Again thank you so much for all your work

alt.Chart(terrordata,
    description='Shows the frequency of terror attacks between two countries.',
).mark_tick(tickThickness=1.5, font="arial").encode(   
x=alt.X('date:T',axis=alt.Axis(format='%B %Y',title='', labelAngle=0, axisWidth=0,ticks=4, orient="top",)),
    y=alt.Y('country:N',axis=alt.Axis(title='', axisWidth=0), font="Helvetica Neue", fontsize=20),
    color=alt.Color("casualties:Q",
            legend=alt.Legend(
                title='Todeszahlen',
                titleFont="s-font-serif",
                titleFontWeight="12",
            ),
            scale=alt.Scale(
                domain=['0', '5'],
                range=['#ffb6b6', '#e23b3c'],
            ),
        ),).configure_cell( width=800).configure_scale(bandSize=100).configure_axis(
    titleFont="s-font-serif",
    titleFontSize=16,
    tickLabelFont="s-font-serif",
    tickLabelFontSize=12,
    tickSize=0
)

stripplot

documentation

All 31 comments

I'm not sure... @domoritz or @kanitw, can you help with this?

I know about https://vega.github.io/vega/docs/api/locale/. @HalukaMB how did you change the locale?

I was literally just changing by using

import locale
locale.setlocale(locale.LC_ALL, 'de_DE')

hoping this might do it.

Is there a way to manually change the title of the ticks by using mapping or parsing in a list of strings?

Setting the locale in Python does not set the locale in JavaScript.

I can add a way to set the locale in ipyvega but I don't know how that would work in JupyterLab. @ellisonbg will know.

I hoped that it would transform the data before getting converted into Vega. Anyway, is there a way to custommap values in Altair using something like a dictoinary? Like having values from 0 to 60 in the data but then defining the x-axis with the labels
{x<20:"low", 20=40: "high"}

@HalukaMB I think the cleanest way to do that is to preprocess the data in Pandas and pass it to Altair. But this is a separate issue.

Yes, but how do I sort then by date on the altair-axis after changing the English dates to German ones in pandas?

@HalukaMB We should figure out how to set the locale from Altair so you don't have to do that.

That would be amazing guys. And also if there is a way to implement Python's apply and map functions into certain parts of the graphics that would be amazing!

@HalukaMB Can you file a separate issue with an example?

@ellisonbg Is there a way to know the locale in a JupyterLab extension? If so, we could pass that information to Vega.

Like the original poster, I would like to change the language for displaying datetime data.

Is there some way I can pass a specified locale to Vega with Altair? Preferably, I would be able to change the language when rendering to Jupyter Lab. However, if this is currently not possible, then it still would be very useful to know if it is possible to generate a Vega specification that will use my locale when viewed as html.

Any suggestions are greatly appreciated!

Vega-Embed 6.1.0 supports formatLocale and timeFormatLocale. I think this issue can be closed.

It's not clear though how altair passes the config with this information to vega-embed... well maybe it is but I couldn't find the information in the documentation :)

Altair cannot currently pass locale information to vega-embed. If you want to adjust locale, I'd suggest exporting the chart as JSON and using vega-embed directly.

@jakevdp that's my point :) that's why this issue cannot be closed (except if the feature is refused of course). It would make sense that altair can pass this information, for example when using it in a notebook environment where one does not have control over vega-embed (if this is possible...).

It would be great to be able to do that; however, given the fact that the locale is not part of the chart spec, and given the constraints of how Jupyter and JupyterLab display charts, I don't see any viable route forward to allowing the user to control this property from the Python layer.

The best option would probably be to open a feature request in Vega/Vega-Lite to allow the locale to be set either via the chart spec or the vegaEmbed metadata, rather than requiring a Javascript API call.

the vegaEmbed metadata

@jakevdp the post above by @domoritz announce the release of a new version of vega-embed that accepts setting the local via its configuration and not an API call.

Oh, OK, then you should use those :smile:

This will require your frontend renderer to use Vega-Embed 6.1 or newer, if I'm reading the thread correctly; I believe that Jupyterlab and Jupyter Notebook frontend extensions are still on version 5.

For Jupyter Notebook, you could open a feature request in https://github.com/vega/ipyvega. For JupyterLab, you could open a feature request in https://github.com/jupyterlab/jupyterlab.

@jakevdp sorry I'm new to altair so I may be missing something, but how do you pass those options to vega-embed? I thought altair was responsible of that, but from what you are telling, it's actually the notebook environments that takes care of instantiating vega-embed when altair generates a spec ?

You can use alt.renderers.set_embed_options to pass embed options to the renderer to pass to the vegaEmbed options.

But yes, the notebook frontend extensions are repsonsible for loading vegaEmbed and handling these options. Altair has no control over the frontend extension the user has loaded, or what it does with the chart specification Altair produces.

This disconnect between backend and frontend is fundamental to the design that the Jupyter developers have chosen for libraries that do rich javascript-based display in the notebook.

@jakevdp great, thanks for the clarification :)

I鈥檒l update the notebook renderer with the next major Vega-Lite Version release in the coming weeks.

Will there be any new 3.X series release, or is Vega-Lite 4.0 the next one?

4 is the next one but it will be backwards compatible with v3.

You can use alt.renderers.set_embed_options to pass embed options to the renderer to pass to the vegaEmbed options.

But yes, the notebook frontend extensions are repsonsible for loading vegaEmbed and handling these options. Altair has no control over the frontend extension the user has loaded, or what it does with the chart specification Altair produces.

This disconnect between backend and frontend is fundamental to the design that the Jupyter developers have chosen for libraries that do rich javascript-based display in the notebook.

Can you give me a concrete example to pass the local settings?

For time format locale, you can pass a dict object from https://github.com/d3/d3-time-format/tree/master/locale to the embed options. For example:

from urllib import request
import json

# fetch & enable a German time locale.
with request.urlopen('https://raw.githubusercontent.com/d3/d3-time-format/master/locale/de-DE.json') as f:
  de_time_format = json.load(f)
alt.renderers.set_embed_options(timeFormatLocale=de_time_format)

# plot the chart
df = pd.DataFrame({
    'date': pd.date_range('2020-01-01', freq='D', periods=180),
    'value': np.random.randn(180).cumsum()
})

alt.Chart(df).mark_line().encode(
    x='date',
    y='value',
)

visualization - 2020-04-03T135909 993

It might be worth adding some convenience functions to Altair and put some examples in the documentation.

@jakevdp Thank you!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jtbaker picture jtbaker  路  3Comments

galloramiro picture galloramiro  路  3Comments

zanarmstrong picture zanarmstrong  路  4Comments

DentonGentry picture DentonGentry  路  3Comments

breadbaron picture breadbaron  路  4Comments