Sigma with VueJs

[evrenonur]

Is there any documentation for use with VueJs?

[jacomyal]

Hello,

There is none yet. However, I've plugged sigma.js in a Vue application once, and the process is quite the same as with React and Angular:

1. Create a component, with a DOM element that will be the root of the sigma instance:

<div id="graph-container" ref="sigmaRoot" class="absolute inset-0" />

2. The component must have sigmaInstance and sigmaRoot in its state:

setup() {
  return {
    // ...
    sigmaRoot: ref<HTMLDivElement | null>(null),
    sigmaInstance: shallowRef<Sigma | null>(null),
  };
}

4. Instantiate sigma when the component becomes mounted:

mounted() {
  this.sigmaInstance = new Sigma(
    someGraph,
    this.sigmaRoot
  );
  // Bind events, etc...
}

4. Kill sigma before the component becomes unmounted:

beforeUnmount() {
  // Unbind events, etc...
  this.sigmaInstance.kill();
  this.sigmaInstance = null;
}

And that's basically it.

I'll leave this ticket opened so that we release a working example at some point, similar to what we did with Angular (which is probably outdated...).

[evrenonur]

Thank you. I am patiently waiting for the sample you will publish. @jacomyal