@factman/graph-ui v1.0.1
Welcome to the GraphUI
Website | Installation | Usage | Live Demo | Options | Team | Sponsor
GraphUI is a JavaScript extension for plotting graphs for any website project.
- Lightweight.
- Zero dependencies.
- Plot with SVG and not Canvas.
- No SVG knowledge is required for implementation.
- Designed for beauty.
- Responsive Design.
- Highly customizable.
- Easy implementation.
Installation
There are two ways to download or install GraphUI in any website project.
Download or Clone From GitHub
Download from Github:
Clone from Github:
git clone https://github.com/factman/GraphUI.gitInstall from NPM
Install from NPM:
npm install @factman/graph-uiNote: use the CSS and JS files in the dist folder.
Usage
Import the CSS stylesheet in the <head> section of your <html> document.
<link rel="stylesheet" href="css/GraphUI.min.css" />Import the JavaScript extension as the last child of the <body> tag.
<script src="js/GraphUI.min.js"></script>After that, create an empty <div> tag with an #id (default: "graph") within the container where you need the graph to be plotted.
<div class="container card">
<div id="graph"></div>
</div>Initialize GraphUI in a JavaScript file or within a <script> tag below GraphUI extension.
<script src="https://cnd.com"></script>
<script>
var data = {
"Mon": [3,4,6],
"Tue": [2,8,1],
"Wed": [2,4,3],
"Thu": [2,1,5],
"Fri": [1,6,3],
"Sat": [1,4,3],
"Sun": [5,4,1],
};
new GraphUI({
data: data,
elementId: "graph"
});
</script>Option elementId is optional if you used the default #id "graph" read more about GraphUI Options
Live Demo
View Live Demo and examples.
Options
License
Team
These folks keep the project moving and are resources for help.
Author
The guy who manage releases, review feature requests, and ensure GraphUI is properly maintained.
Sponsor
The following company support GraphUI ongoing maintenance and development. Become a Sponsor to get your logo on our README and website.