2IOA0-35 / dbl-app

Visualisation Web app available at https://envision.riswick.net
https://2ioa0-35.github.io/dbl-app
0 stars 0 forks source link

#2.2: Choose library/libraries #3

Closed tom-90 closed 3 years ago

tom-90 commented 3 years ago

Choose a library (or multiple if necessary) to produce the visualisations that are needed.

zwamdurkel commented 3 years ago

To no one's surprise, D3 seems like the most suitable library. It has support for all our visualizations and while I have not extensively looked at the full toolset, there seem to be a lot of ways to implement interactive content. (hover, select, ctrlkey, etc) Since it's JS at its core, any JS interaction can theoretically be implemented.

All other libraries that come close to being suitable are often running D3 under the hood (eg: vega). So I figured it's best to just use D3, since it seems to be the industry standerd and it has a lot of resources available online. I've actually looked through 20-30 libraries, but most just focus on simple graphs like bar or line plots.

As far as implementing it in React, there exists a React D3 library, as briefly mentioned by Tom during the meeting. I've looked a bit into the actual implementation of D3 in React and some examples show that this specific React library is not needed to get a functioning instance of D3, but I think we might as well use this library specifically designed to work with React.

EDIT: if we want to use static diagrams we can also make those with D3, or potentially with Chart.js which is also very popular