seanlowe / obsidian-timelines

Create a timeline view of all notes with the specified combination of tags
https://seanlowe.github.io/obsidian-timelines/
MIT License
39 stars 2 forks source link

[Bug] Flat timeline does not render #45

Closed F4zeless closed 1 month ago

F4zeless commented 1 month ago

Pretty much the issue in the title.

I am creating a timeline of roughly 40-50 events atm. No pictures, just plain text and links. The timeline renders all the events in the default vertical style. However, when I use the type = flat argument it does not render anymore.

Sorry if notation of issue is untypical. Its my first time using github.

seanlowe commented 1 month ago

No worries, thanks for creating the issue - hopefully we can help figure this out. Could you post an example of what your events (are you using frontmatter or HTML?) and what your ob-timeline codeblock looks like?

F4zeless commented 1 month ago

I have been using the frontmatter tags.

Currently I try to run the following codeblock for the timeline:

tags=Government
startDate=1945
endDate=2025
divHeight=600
minDate=1940
maxDate=2030
ZoomInLimit=week
ZoomOutLimit=315360000000000
type=flat

if I leave out the last statetement it renders vertically and as far as I can tell, correctly:

tags=Government
startDate=1945
endDate=2025
divHeight=600
minDate=1940
maxDate=2030
ZoomInLimit=week
ZoomOutLimit=315360000000000

Are there certain types of events which break the hoizontal rendering?

seanlowe commented 1 month ago

so far as I can tell it should work...

I see an issue, not sure if it's the issue yet. The ZoomInLimit and ZoomOutLimit are capitalized. Try only changing the Z to lowercase and see what that does.

There is an item on my todo list to provide more discrete feedback should there be a parsing error in the codeblock but I haven't gotten to it yet.

F4zeless commented 1 month ago

I tried it, but it does not seem to make a difference

seanlowe commented 1 month ago

Hm... Alright, in the plugin settings there's a toggle for "debug mode" at the bottom. Flip that on, then go to where your codeblock is. Hit Ctrl + Shift + I to open up the dev tools inside obsidian. Open up the console, (probably clear it out first) and then try to render the timeline.

It'll spit out a TON of info - mostly I want to see if there are any errors.

If there aren't we can look at the warnings, which there might be

F4zeless commented 1 month ago

There are 2 errors at the end of the log

vis-timeline-graph2d.js:11284 Uncaught (in promise) TypeError: Unknown item type "red" at eval (vis-timeline-graph2d.js:11284:17) at Array.forEach () at ItemSet._onUpdate (vis-timeline-graph2d.js:11250:9) at ItemSet.setItems (vis-timeline-graph2d.js:11098:12) at Timeline.setItems (vis-timeline-graph2d.js:15104:34) at new Timeline (vis-timeline-graph2d.js:15020:12) at TimelineBlockProcessor.eval (block.ts:413:22) at Generator.next () at eval (tslib.es6.js:121:71) at new Promise () eval @ vis-timeline-graph2d.js:11284 _onUpdate @ vis-timeline-graph2d.js:11250 setItems @ vis-timeline-graph2d.js:11098 setItems @ vis-timeline-graph2d.js:15104 Timeline @ vis-timeline-graph2d.js:15020 eval @ block.ts:413 eval @ tslib.es6.js:121 awaiter @ tslib.es6.js:117 buildHorizontalTimeline @ block.ts:328 eval @ block.ts:498 fulfilled @ tslib.es6.js:118 Promise.then (async) step @ tslib.es6.js:120 eval @ tslib.es6.js:121 awaiter @ tslib.es6.js:117 eval @ main.ts:31 t.initDOM @ app.js:1 t.toDOM @ app.js:1 t.sync @ app.js:1 e.sync @ app.js:1 (anonymous) @ app.js:1 e.ignore @ app.js:1 t.updateInner @ app.js:1 t.update @ app.js:1 e.update @ app.js:1 dispatchTransactions @ app.js:1 e.dispatch @ app.js:1 (anonymous) @ app.js:1 setTimeout (async) Ls @ app.js:1 ds.blur @ app.js:1 e.runHandlers @ app.js:1 e.handleEvent @ app.js:1 vis-timeline-graph2d.js:11284 Uncaught (in promise) TypeError: Unknown item type "red" at eval (vis-timeline-graph2d.js:11284:17) at Array.forEach () at ItemSet._onUpdate (vis-timeline-graph2d.js:11250:9) at ItemSet.setItems (vis-timeline-graph2d.js:11098:12) at Timeline.setItems (vis-timeline-graph2d.js:15104:34) at new Timeline (vis-timeline-graph2d.js:15020:12) at TimelineBlockProcessor.eval (block.ts:413:22) at Generator.next () at eval (tslib.es6.js:121:71) at new Promise ()

Seems to have to do with red as color? I have issues with copying the whole log as its to long.

seanlowe commented 1 month ago

Hmm.. This tells me what file the error is occurring in (block.ts) and what function (buildHorizontalTimeline) but not where the error is occurring.

Could you provide one or two examples of the frontmatter in your notes so I can recreate the problem?

F4zeless commented 1 month ago

example background


description: Coalition Parties:

example event:


title: description: color: red type: box startDate: 1971-10-10 endDate: 1971-10-10 era: path: "" tags:

F4zeless commented 1 month ago

I Just found the issue myself. By accident i attributed one event as type = red instead of type = box. I am not sure why this is not an issue with vertical rendering. Maybe the type is not considered? Nevertheless thankfull for your time!

seanlowe commented 1 month ago

As for why it does not affect the vertical timeline, really the only keyword that matter to the vertical one (for right now) is tags. None of the rest of them do anything for the vertical timeline.

Glad you figured it out. I do think the malformed / bad input notice should be bumped up in priority lol. Would have made finding this a lot easier for you.