Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create index.html #114

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

Conversation

adityakrmishra
Copy link

HTML structure: Sets up the basic HTML structure with a div element (#viz) where the D3.jsvisualization will be rendered.

Metadata: Includes the charset and title for the document.

D3.js: Loads the D3.jslibrary from a CDN.

CSS: Links to the style.css file for styling the visualization.

JavaScript: Links to the app.js file where the D3.jsvisualization code is written.

Explanation of Code:
HTML (index.html):

Includes D3.jsand sets up a basic HTML structure with a div (#viz) to hold the visualization.

CSS (style.css):

Adds basic styles for the body and visualization elements.

JavaScript (app.js):

Data Structure: stateMachineData contains sample nodes and links representing states and transitions.

SVG Canvas: Sets up an SVG canvas with defined width and height.

Simulation: Uses D3.jsforce simulation to position nodes and links.

Nodes and Links: Appends circles and text to represent states, and lines to represent transitions.

Tick Function: Updates positions of nodes and links on each tick of the simulation.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant