How can I add external javascript libraries?

[gvlpedro]

Hi, thanks for this amazing project, I would like to know more about adding D3.js (v4) but I don't see a clear documentation about adding code from external libraries. Could you clarify how to do it? thanks

[raquo]

Hi! That's quite a broad question, as different JS libraries require different integrations.

In general, you need to read the docs for the library in question (D3.js), and write Scala.js facades to its classes / functions / etc. that you need (or use ScalablyTyped facades, although I find it easier to write my own). Then, find the Laminar functions necessary to complete the integration.

You need to know how to use D3 classes / functions from plain JS, and once you know that, you will have more specific questions about how to integrate the library with Laminar. Once you have those specific questions (e.g. how to render a third party html element in Laminar, or how to connect observables to JS libraray callbacks), you will probably find the answers in this documentation section: https://laminar.dev/documentation#integrations-with-other-libraries (as well as Scala.js docs)

For an example integration with JS lib (Chart.js in this case), see my example here: https://demo.laminar.dev/app/weather/gradient/squamish

[gvlpedro]

thank you @raquo it was a complete answer, it seems a long integration but I will check your demo because it is very useful.