Your mission

Your task is to make this work for any general time series dataset. You will be coding the horizonChart$(...)$ function described below to produce a mirrored horizon chart.

The arguments for the function are:

source $--$ the source dataframe

bands $--$ the number of bands. If the data is only positive or only negative a $2$ here means two bands$/$colors$.$ If there are both positive and negative values and we enter $2,$ that means $4$ bands $--2$ positive, $2$ negative

timecol $--$ the string of the time $($x$)$ column in the source dataframe

valcol $--$ the string of the value $($y$)$ column in the source dataframe

width $--$ the desired width of the horizon chart $($default $500)$

height $--$ the desired height of the horizon chart $($default $75)$

poscolors $--$ the colors to use for the positive values $($the default here is $4),$ so if there are more bands than colors, there should be some kind of error or other reasonable behavior

negcolors $--$ the colors to use for the negative values $($the default here is $4),$ so if there are more bands than bands, there should be some kind of error or other reasonable behavior

xaxis $--$ an alt.Axis$(...)$ object describing how we want the x$-$axis to appear. Default is no x$-$axis ticks$/$labels$/$etc$.$ but we could say something like alt.Axis$($title$=$'TIME'$)$ to configure this

What you will be returning is an Altair chart. For example, here's the result for: horizonChart$($sindf$,4,$'time','amp',xaxis$=$alt.Axis$($title$=$"period"$))($we define sindf below$).$

Ten hints to get you going:

Start with the example code above. Figure out how to extend the code to make $3$ bands. What would area$3$ look like? Once you have that, some structures will hopefully become obvious to support more generalized loops.

Focus on only positive data first. When you have that fully working, figure out how to add in the negative data. There will be different ways of doing this. But you'll need to find some way of focusing on either the positive or negative data in your time series. This can be done by augmenting the dataframe in some way or in filtering to the data you want. Depending on your approach, you might find the Pandas$/$Numpy $.$clip$(...)$ helpful

There are probably multiple ways of solving this, but the example above is a good starting point.

The interpolation in the default example above will probably not work if you introduce negative values.

It's ok for the visualizations to look "blocky" when there is little data. In most situations, we will use longer time series.

Make sure you understand the code above and what it's doing. There are things that the example is doing that will not work for our situation $($e$.$g$.,$ colors and opacity$).$

Do not hard code anything in your function.

Make sure you understand the trick of "extending" a chart $($area$2$ is copying area$1--$it inherits everything in area$1--$but then overrides the y$-$axis encoding$).$

You can write additional helper functions.

If you're struggling with the area charts, try to use mark$\_$circle or mark$\_$point temporarily to help you debug. Are the points where you expect them to be$?$

Test everything!