You can download CanvasJS StockChart Library from Download Page.
There are 2 JavaScript source files included in the downloaded zip file.
You can refer / include CanvasJS StockChart library to HTML file using src attribute in the <script> tag.
We recommend you to include compressed version for production environment, while you can continue to use uncompressed in development machine.
<head> <script type="text/javascript" src="canvasjs.stock.min.js"></script> </head>
Create an HTML file in the same directory as library and copy the following code into it.
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.stock.min.js"></script>
<script type="text/javascript">
window.onload = function () {
var stockChart = new CanvasJS.StockChart("chartContainer",{
title:{
text:"CanvasJS StockChart"
},
charts: [{
data: [{
type: "spline",
dataPoints: dataPoints
}]
}]
});
stockChart.render();
}
var limit = 365; //increase number of dataPoints by increasing this
var x = new Date(2019, 00, 00), y = 1000;
var dataPoints = [];
for (var i = 0; i < limit; i += 1) {
dataPoints.push({ x: x, y: y });
x = new Date(x.setDate(x.getDate()+1))
y += Math.round((Math.random() * 10 - 5));
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 400px; width: 100%;"></div>
</body>
</html>
Save the file and open it in browser. A Basic Stock Chart should render on your browser.
You can easily integrate CanvasJS StockCharts with server side technologies like ASP.NET MVC, PHP, Spring MVC, JSP and frameworks like React, Angular, Vue.js, etc.
If you can’t see the StockChart being rendered, please check browser console (Shortcut – Ctrl + Shift + J) for any error.
If you need further help feel free to post on our support forum at https://canvasjs.com/forums/
Server Side Technologies |
Front End Technologies |
Contact |
|
|---|---|---|---|
| ASP.NET MVC Charts | JavaScript Charts | FAQs | |
| PHP Charts | jQuery Charts | Sales Enquiries | |
| Spring MVC Charts | React Charts | Support Forum | |
| JSP Charts | Angular Charts | Careers | |
| JavaScript StockCharts | |||
Privacy Policy © fenopix