Shapes with labels defined inside the shape + Dataview Filter Bug

[chunisama]

• Using MacOS Sonama 14.5
• Browser: Google Chrome.
• Using vis-network: 9.1.9

Use Case: I am using the vis-network with a DataView filter function, in which I use the filter to isolate specific nodes in the vis-network chart. In certain situations, whenever we use the filter option in the configure object and filter a node cluster by a single item, the chart zooms out, which causes the chart to look very small. The user has to zoom back in on the node clusters to be able to view the chart correctly.

I tried removing my custom code layered on top of vis-network to isolate the issue, but I noticed when I changed the shape config from dot to box, the zoom out issue was gone. I then noticed whenever I used a shape with the label rendered outside its shape, the bug would return. Whenever I used a shape with a label rendered inside the shape, the bug would go away. What is going on here? Happy to give more details on my implementation if needed.

Code snippets

https://visjs.github.io/vis-network/docs/network/configure.html#

• Configure options config

      {
        nodes: new DataView(new DataSet<ChartNode>(graphData.nodes), {
          filter: function (item: any) {
            return (
              exampleFilter(item, networkChartState.itemsA) &&
              exampleFilterTwo(item, networkChartState.itemsB)
            );
          },
        }),
        edges: new DataSet<Edge>(graphData.edges),
      },

https://visjs.github.io/vis-network/docs/network/nodes.html#

• Node Options config

      nodes: {
        shape: 'dot',
        borderWidth: 0,
        font: {
          size: 15,
          color: 'black',
          face: 'arial, sans-serif',
        },
        physics: true,
        shapeProperties: { borderRadius: 6 },
      },
      layout: {
        randomSeed: 2,
      },
      physics: {
        stabilization: {
          enabled: true,
          iterations: 1000,
          updateInterval: 1,
        },
        barnesHut: {
          springLength: 160,
          springConstant: 0.085,
          damping: 0.25,
          avoidOverlap: 0.6,
          gravitationalConstant: -2300,
          centralGravity: 0.4,
        },
      },
    },