Cytoscape.js——(试图学习)数据分析与可视化插件的使用

官网给出的调用方式:

1 <script src="cytoscape.min.js"></script>

或者

1 <script type="module">
2 import cytoscape from "./cytoscape.esm.min.js";
3 </script>

可以使用的程序包在cytoscape/dist/目录下,你可以通过npm下载:

npm install cytoscape

或者你也可以直接从GitHub上clone下来使用。

1 cytoscape.min.js : 一个包含包中所有依赖项的小型UMD构建。这个文件对一些小的页面很有用,比如说可以作为某篇学术论文的补充材料。
2 cytoscape.umd.js : 包含包中所有依赖项的非小型UMD构建。这个文件对于一些小的页面的调试很有用,同样可以作为学术论文的补充材料。
3 cytoscape.esm.min.js : 一个小型ESM(导入/导出)构建,包含包中所有的依赖项。此文件的用途与上述相同,但它可以作为ES6模块导入而不需要打包。
4 cytoscape.cjs.js : 一个没有任何捆绑依赖关系的非小型CJS(Node.js)构建。这将由Node.js或类似于捆绑包的Webpack通过require('cytoscape')自动使用。
5 cytoscape.esm.js : 无任何捆绑依赖项的非小型ESM(导入/导出)生成。这将由Node.js或类似于捆绑包的Webpack通过import cytoscape from 'cytoscape'自动使用。

 Cytoscape.js的一个实例对应于一个图。您可以创建一个实例,如下所示:

1 var cy = cytoscape({
2   container: document.getElementById('cy') // container to render in
3 });

为了方便起见,可以将jQuery实例作为容器传递:

1 var cy = cytoscape({
2   container: $('#cy')
3 });

 

上一篇:渐进式 Unbundled 开发工具探索之路


下一篇:RISC-V MCU开发教程之与Matlab的串口通信