Home › Forums › Feature Requests & Feedback › Simplify plotting with CanvasJS even further › Reply To: Simplify plotting with CanvasJS even further
Thank you for your very good code. Two question:
There are 5 observations and the first observation should be index 1 and not zero on the x-axis in your plot. How to solve this? I think it is a JavaScript nuisance to assume that the first value in an array has index zero.
So the x-axis should be from 1 to 5 because we have 5 observations.
Secondly, why do these two HTML and JavaScript files not work?. The two files are in the same folder on my desktop.
Index.html
<!DOCTYPE html> <html> <head> <script src="https://cdn.canvasjs.com/canvasjs.min.js"></script> <script type="text/javascript" src="renderchart.js"></script> <script> window.onload = plot() ; </script> </head> <body> <div id="chartContainer" style="width: 100%; height: 400px"> </body> </html>
renderchart.js
function renderChart(extDps){ var dps = []; for(var i = 0; i < extDps.length; i++) { dps.push({y: extDps[i]}); } var chart = new CanvasJS.Chart("chartContainer", { theme: "light2", //"light1", "dark1", "dark2" title: { text: "Price chart for crypto currency: ", fontSize: 22, fontFamily: "arial", fontWeight: "lighter", horizontalAlign: "left" }, axisY: { includeZero: false, gridThickness: 0.5 }, axisX: { // minimum: 0, // maximum: 5.1, interval: 1, gridThickness: 0.5 }, data: [{ type: "line", dataPoints: dps }] }); chart.render(); } function plot() { var dataPoints = [450,414,520,460,450]; renderChart(dataPoints); }
For consistency I prefer two keep all JavaScript functions in a .js file and all HTML in a .html file.