How to cite the sbgnviz.js into the <script> lable of html?

[HanMengying]

Hi, I want to use this sbgnviz.js to show my pathway inserct my frame of Django, so I need to insert this into html by citing the label of <script>. I saw your readme that "In plain JS you do not need to require the libraries you just need to register sbgnviz with the options". Exactly, I have no idea how to do. Could you give me (An example) some codes to how to visualize a specific pathways as detailed as possible? I have some format pathways, such as sbgn,sbml. I am looking foward to your reply.

[cannin]

@HanMengying maybe this CodeSandbox example helps: https://github.com/cannin/sbgnviz.js-sample-app

[GeorgeS2019]

@cannin The sbgnviz.js-sample-app is written in way that is very different from the typical cytoscape extension.

Is it possible to provide simple example showing how to use the various sbgnviz API in the same format as typical cytoscape extensions

A single demo.html showing how to use SBGNviz API to load a sbgn.xml file and display that.

e.g.

<link href="app/css/sbgnviz.css" rel="stylesheet">
<script src="node_modules/sbgnviz/dist/sbgnviz.min.js"></script>

with other dependent stylesheet and cytoscape and cytoscape extension libraries. 

var sbgn = window.sbgn = sbgnviz({
	container: document.getElementById('sbgn-network-container'),

	ready: function(){
},

[rajanarahul93]

Hi, I’d like to work on this issue. Please assign it to me.

My Approach:

1. I will create a simple demo.html file that integrates sbgnviz.js using <script> and <link> tags.
2. The file will include:
   • All required dependencies (e.g., cytoscape.js, sbgnviz.js, and CSS).
   • Initialization of sbgnviz with a container.
   • A function to load and visualize an SBGN-ML file.
3. I will ensure the demo is clear, minimal, and works as expected.

Looking forward to your approval!