Sample Use Case of GraphJS:
1. Import GraphJS library into your HTML file.
2. Create a canvas element in your HTML file where you want the graph to be displayed.
3. Create an array of data points that you want to display on the graph.
4. Create an options object that defines the settings for the graph such as the type of graph (line, bar, scatter), colors, labels, etc.
5. Create a new instance of the GraphJS class and pass in the canvas element, data array, and options object as arguments.
6. Call the plot() method on the GraphJS instance to render the graph on the canvas.
Example HTML code:
```
<!DOCTYPE html>
<html>
<head>
<title>GraphJS Sample</title>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script type="text/javascript" src="graph.js"></script>
</head>
<body>
<h1>GraphJS Sample</h1>
<label for="dataInput">Input Data:</label>
<input type="text" id="dataInput">
<button onClick="renderGraph()">Render Graph</button>
<br>
<canvas id="myCanvas"></canvas>
<script>
function renderGraph() {
// Get data points from input box
var dataString = document.getElementById("dataInput").value;
var data = dataString.split(",").map(function(x){return parseInt(x)});
// Define graph options
var options = {
type: 'line',
dataLabels: true,
axisLabels: {x: "Time", y: "Value"}
}
// Create GraphJS instance and plot graph
var myGraph = new GraphJS(document.getElementById("myCanvas"), data, options);
myGraph.plot();
}
</script>
</body>
</html>
```
This HTML file includes an input box where the user can enter data points separated by commas. Clicking the "Render Graph" button calls a renderGraph() function that retrieves the data from the input box, creates a GraphJS instance with the data and options, and plots the graph on the canvas element on the page.
Note: This is just a basic example of how to use GraphJS. The options object can be customized to suit your needs and additional methods can be called on the GraphJS instance to interact with the graph (e.g. update data, handle user interactions).
