How to have Events appear not stacked in Emkay's vis.js Timeline

Hello! I’ve been using TW5 for a while now, loving it. My favorite plugins are Tiddlymap by /felixhayashi and the one I have a question about: Emkay’s vis.js Timeline.

My Timeline install works great. I’m just trying to have my events not be rendered stacked but rather all in a row (they won’t be overlapping because I’m using a sequence of events where each event starts when the last has ended.)

I believe I’m to achieve this by using the ‘config’ attribute:
<$visjstimeline (...) config="timelineConfig"/>
where ‘timelineConfig’ is the title of a tiddler I created, that has the JSON/application type, and has the text:

var options = {
  stack: false
};

However it’s not working. The events I have entered appear stacked, even after redrawing the timeline. What am I doing wrong, oh wise ones?

win11, Firefox, TiddlyWiki version 5.2.3

Although I have not used Emkay’s vis.js Timeline plugin, there are two thing I note from your posted details:

  • In TiddlyWiki, tiddlers containing json have a type of application/json (not “JSON/application” as you indicated in your post).
  • The documentation at https://visjs.github.io/vis-timeline/docs/timeline/#Configuration_Options shows the syntax for assigning a JSON object to a Javascript variable (i.e., var options = { ... }). However, for use in TiddlyWiki, your timelineConfig tiddler should contain ONLY the JSON object itself, without any extra Javascript syntax.

Try something like this in your timelineConfig tiddler:

{
"stack":"false"
}

Let me know how it goes…

enjoy,
-e