UNPKG

ccnetviz

Version:

[![Build Status](https://travis-ci.org/HelikarLab/ccNetViz.svg?branch=master)](https://travis-ci.org/HelikarLab/ccNetViz) [![License: GPL v3](https://img.shields.io/badge/License-GPL%20v3-blue.svg)](https://www.gnu.org/licenses/gpl-3.0) [![semantic-releas

63 lines (58 loc) 1.68 kB
<!DOCTYPE html> <html> <head> <script src="../lib/ccNetViz.js"></script> <style> canvas, html, body { margin: 0; padding: 0; } </style> </head> <body> <script> var nodes = [{ x: 0, y: 0 }, { x: 1, y: 1 }, { x: 0.1, y: 0.1 }]; var settings = { styles: { node: { texture: '../../examples/images/node.png', label: { hideSize: 16 }, }, edge: { arrow: { texture: '../../examples/images/arrow.png' }, }, }, }; var edges = [ { source: nodes[0], target: nodes[1] }, { source: nodes[1], target: nodes[2] }, ]; var canvas = document.createElement('canvas'); canvas.width = 250; canvas.height = 250; document.body.appendChild(canvas); var graph = new ccNetViz(canvas, settings); graph.set(nodes, edges).then(() => { graph.draw(); if (graph.findArea(0, 0, 0.1, 0.1, true, false).nodes.length === 2) { let elem = document.createElement('div'); elem.setAttribute( 'style', 'position:absolute;background:red;width:100px;height:100px;left:0;top:0' ); document.body.appendChild(elem); } if (graph.findArea(0, 0, 0.1, 0.1, false, true).edges.length === 2) { let elem = document.createElement('div'); elem.setAttribute( 'style', 'position:absolute;background:blue;width:100px;height:100px;left:100px;top:0' ); document.body.appendChild(elem); } }); </script> </body> </html>