JavaScript InfoVis Toolkit Reuse

I’m trying to integrate pages with advanced visualization relying on the JavaScript InfoVis Toolkit created in the past. For sure, a lot could be made with D3.js, but here the idea is too reuse what was made before with a minimum of efforts.

At this stage, I didn’t succeed in importing the code (may be because it is was not modularized).

The web site is at https://philogb.github.io/jit/demos.html.

I uploaded the script as an attached document on a notebook, then I tried the following:
t = (await import(await FileAttachment(“jit.js”).url())).SCRIPTS

Here I do have an error which is not quite explicit:
t = TypeError: Cannot set property ‘$jit’ of undefined

Not being a javascript specialist, I would like to know what the issue could be, if some people already attempted to reuse this library and what could be eventually the actions for making it useable with ObservableHQ (link to some information which could help performing the adaptation).

Thanks in advanced for the support of the community

Maybe you can start from this example https://observablehq.com/@fil/hello-jit

Thank you so much, Fil.
I will work on it and keep you informed.
Best regards.
Nicolas

I succeeded creating a basic treemap. Thanks for your help

1 Like

Hi Fil,
Continuing to assess usage of jit.js on obervable.
I tried to put two treemap on the same notebook, without success (it seems that some mismatch exist concerning the used canvas…

Any idea?

Concerning the extra code provided on the example, does some documentation explaining how you proceed exist somewhere?

Thanks in advance for your support :slight_smile:

If you share a link to a notebook I will take a look and see if I can fix it. But it’s clear now that trying to use JIT is not going to be without effort :slight_smile:


I tried creating 2 treemap with 2 canvas, and another visualization. It seems that labels are not applying on all the vis.
My feeling is that there is a mismatch concerning the used canvas. E.g. the tips are not restricted to the canvas of the second treemap, but are also displayed below. It is may be the reason why label are put in a single place. However, it is not easy to identify how the JIT implementation approach fit with the canvas usage approach of Observable within a notebook. It’s only a feeling, and may be not the actual reason for the encountered issue.
JIT remains useable, but with one JIT visualisation per notebook.