Unhandled Rejection (TopologyException): found non-noded intersection ..

[talkhanz]

Hi,

I have been running into an error whenever I plot the fcose plot using the data.

Can anyone help me debug this?

Full error message:

Unhandled Rejection (TopologyException): found non-noded intersection between LINESTRING ( -16.981625 -46.981625, 13.778448000000001 -16.221552000000003 ) and LINESTRING ( -29.23426 -59.23426, 12.556896 -17.443104 ) This is how I draw the fcose plot.

var cytoscape = require('cytoscape');
let fcose = require('cytoscape-fcose');
let layoutUtilities = require('cytoscape-layout-utilities');
cytoscape.use( layoutUtilities ); // register extension
cytoscape.use( fcose ); // register extension
 var options = {
          name: 'fcose',

          // 'draft', 'default' or 'proof' 
          // - "draft" only applies spectral layout 
          // - "default" improves the quality with incremental layout (fast cooling rate)
          // - "proof" improves the quality with incremental layout (slow cooling rate) 
          quality: "proof",
          // Use random node positions at beginning of layout
          // if this is set to false, then quality option must be "proof"
          randomize: false, 
          // Whether or not to animate the layout
          animate: false, 
          // Duration of animation in ms, if enabled
          animationDuration: 1000, 
          // Easing of animation, if enabled
          animationEasing: undefined, 
          // Fit the viewport to the repositioned nodes
          fit: true, 
          // Padding around layout
          padding: 30,
          // Whether to include labels in node dimensions. Valid in "proof" quality
          nodeDimensionsIncludeLabels: false,
          // Whether or not simple nodes (non-compound nodes) are of uniform dimensions
          uniformNodeDimensions: false,
          // Whether to pack disconnected components - cytoscape-layout-utilities extension should be registered and initialized
          packComponents: true,
          // Layout step - all, transformed, enforced, cose - for debug purpose only
          step: "all",

          /* spectral layout options */

          // False for random, true for greedy sampling
          samplingType: true,
          // Sample size to construct distance matrix
          sampleSize: 100,
          // Separation amount between nodes
          nodeSeparation: 75,
          // Power iteration tolerance
          piTol: 0.0000001,

          /* incremental layout options */

          // Node repulsion (non overlapping) multiplier
          nodeRepulsion: node => 4500,
          // Ideal edge (non nested) length
          idealEdgeLength: edge => 50,
          // Divisor to compute edge forces
          edgeElasticity: edge => 0.45,
          // Nesting factor (multiplier) to compute ideal edge length for nested edges
          nestingFactor: 0.1,
          // Maximum number of iterations to perform - this is a suggested value and might be adjusted by the algorithm as required
          numIter: 2500,
          // For enabling tiling
          tile: false,  
          // Represents the amount of the vertical space to put between the zero degree members during the tiling operation(can also be a function)
          tilingPaddingVertical: 10,
          // Represents the amount of the horizontal space to put between the zero degree members during the tiling operation(can also be a function)
          tilingPaddingHorizontal: 10,
          // Gravity force (constant)
          gravity: 0.25,
          // Gravity range (constant) for compounds
          gravityRangeCompound: 1.5,
          // Gravity force (constant) for compounds
          gravityCompound: 1.0,
          // Gravity range (constant)
          gravityRange: 3.8, 
          // Initial cooling factor for incremental layout  
          initialEnergyOnIncremental: 0.3,

          /* constraint options */

          // Fix desired nodes to predefined positions
          // [{nodeId: 'n1', position: {x: 100, y: 200}}, {...}]
          fixedNodeConstraint: undefined,
          // Align desired nodes in vertical/horizontal direction
          // {vertical: [['n1', 'n2'], [...]], horizontal: [['n2', 'n4'], [...]]}
          alignmentConstraint: undefined,
          // Place two nodes relatively in vertical/horizontal direction
          // [{top: 'n1', bottom: 'n2', gap: 100}, {left: 'n3', right: 'n4', gap: 75}, {...}]
          relativePlacementConstraint: undefined,

          /* layout event callbacks */
          ready: () => {}, // on layoutready
          stop: () => {} // on layoutstop
        };

        var cy = cytoscape({
          container: $("#" +cy_div_id ) ,// container to render in
          elements: {
              nodes: data['hierarchy']["nodes"],
              edges: data['hierarchy']["links"],
          },

          style: [ // the stylesheet for the graph
            {
              selector: 'node',
              style: {
                'background-color': 'data(color)',
                'label': 'data(name)',
                'height':'data(size)',
                'shape':'data(shape)',
                'width':'data(size)',
              }
            },

            {
              selector: 'edge',
              style: {
                'width': 'data(weight)',
                'line-color': 'data(line_color)',
                'line-style': 'data(line_style)',
                'target-arrow-color': 'data(line_color)',
                'target-arrow-shape': 'data(arrow)',
                'curve-style': 'bezier'
              }
            }
          ],
          zoom: 1,
          pan: { x: 0, y: 0 },

          // interaction options:
          minZoom: 1e-50,
          maxZoom: 1e50,
          zoomingEnabled: true,
          userZoomingEnabled: true,
          panningEnabled: true,
          userPanningEnabled: true,
          boxSelectionEnabled: true,
          selectionType: 'single',
          touchTapThreshold: 8,
          desktopTapThreshold: 4,
          autolock: false,
          autoungrabify: false,
          autounselectify: false,

          // rendering options:
          headless: false,
          styleEnabled: true,
          hideEdgesOnViewport: false,
          textureOnViewport: false,
          motionBlur: false,
          motionBlurOpacity: 0.2,
          wheelSensitivity: 1,
          pixelRatio: 'auto'

       });

        cy.layout(options).run();

This is the data I send to cytoscape:

#####nodes###############
nodes = [{'data': {'id': 'n13', 'name': 'TF_4', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n7', 'name': 'TF_54', 'color': '#ff9e6d', 'type': 'Gene', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n11', 'name': 'TF_11', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n12', 'name': 'TF_62', 'color': '#ff9e6d', 'type': 'Gene', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n14', 'name': 'TF_63', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n10', 'name': 'TF_71', 'color': '#ff9e6d', 'type': 'Gene', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n5', 'name': 'TF_45', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n6', 'name': 'TF_94', 'color': '#ff9e6d', 'type': 'Gene', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n8', 'name': 'TF_67', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n2', 'name': 'Gene_364', 'color': '#0C0FFF', 'type': 'Gene', 'shape': 'ellipse', 'size': 30}}, {'data': {'id': 'n9', 'name': 'TF_34', 'color': '#ff9e6d', 'type': 'TF', 'shape': 'triangle', 'size': 30}}, {'data': {'id': 'n4', 'name': 'Gene_371', 'color': '#0C0FFF', 'type': 'Gene', 'shape': 'ellipse', 'size': 30}}, {'data': {'id': 'n1', 'name': 'Gene_204', 'color': '#0C0FFF', 'type': 'Gene', 'shape': 'ellipse', 'size': 30}}, {'data': {'id': 'n3', 'name': 'Gene_142', 'color': '#0C0FFF', 'type': 'TF', 'shape': 'ellipse', 'size': 30}}, {'data': {'id': 'n0', 'name': 'Gene_378', 'color': '#0C0FFF', 'type': 'Gene', 'shape': 'ellipse', 'size': 30}}]
#####links###############
links = [{'data': {'id': 'e1', 'source': 'n13', 'target': 'n7', 'weight': 3.0, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e3', 'source': 'n11', 'target': 'n12', 'weight': 2.7197932912643576, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e5', 'source': 'n14', 'target': 'n10', 'weight': 1.3816494475867875, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e7', 'source': 'n5', 'target': 'n6', 'weight': 1.294756804469881, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e9', 'source': 'n8', 'target': 'n2', 'weight': 1.1941210320718634, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e11', 'source': 'n9', 'target': 'n4', 'weight': 1.011153791629866, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e13', 'source': 'n6', 'target': 'n1', 'weight': 1.0001219246405488, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}, {'data': {'id': 'e15', 'source': 'n3', 'target': 'n0', 'weight': 1.0, 'arrow': 'none', 'line_style': 'solid', 'line_color': '#ccc'}}]

data =  {"hierarchy": {"nodes": nodes, "links": links}, "status":"success"}

[hasanbalci]

Hi @talkhanz,

I created a JS Bin demo from the data you provided, it seems to be working without any problem and I couldn't reproduce your error. From the error message you provided, however, I'm guessing that it might be related with cytoscape-layout-utilities extension (which is used for component packing) which uses turf as a dependency because I found similar issues in turf GitHub page.

Maybe you can move this issue to cytoscape-layout-utilities with a reproducible JS Bin demo so that we can analyze/debug the problem there.

[talkhanz]

Hi @hasanbalci

Thankyou for getting in touch and taking the time to create JS bin demo!

I guess it does seem to be a problem with cytoscape-layout-utilities.

I'll be closing the issue here then!