How to draw the graph in double line using canvas.js?
Question
<!DOCTYPE HTML> <html> <head> <script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> <script type="text/javascript"> window.onload = function() { var chart = new CanvasJS.Chart("chartContainer", { title: { text: "Line Chart" }, axisX: { interval: 10 }, data: [{ type: "line", dataPoints: [ { x: 10, y: 35 }, { x: 20, y: 14 }, { x: 30, y: 20 }, { x: 40, y: 60 }, { x: 50, y: 50 }, { x: 60, y: 80 }, { x: 70, y: 40 }, { x: 80, y: 60 }, { x: 90, y: 10 }, { x: 100, y: 50 }, { x: 110, y: 40 }, { x: 120, y: 14 }, { x: 130, y: 70 }, { x: 140, y: 40 }, { x: 150, y: 90 }, ] }] }); chart.render(); } </script> </head> <body> <div id="chartContainer" style="height: 400px; width: 100%;"></div> </body> </html>
I have some code in canvas.js but i want to draw the graph in double time graph in based on equation for example 5x+6y=0;8x+5y=0 the equation type in input to draw the graph. i added one example model graph based on the example model graph how to programming the canvas.js please help me.
1 answers
solution1
0 2016-08-27 11:28:39
<!DOCTYPE HTML> <html> <head> <script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> <script type="text/javascript"> window.onload = function () { var chart = new CanvasJS.Chart("chartContainer", { title: { text: "Basic Spline Chart" }, data: [ { type: "spline", dataPoints: [ { x: 10, y: 10 }, { x: 20, y: 25}, { x: 30, y: 20 }, { x: 40, y: 25 }, { x: 50, y: 27 }, { x: 60, y: 28 }, { x: 70, y: 28 }, { x: 80, y: -24 }, { x: 90, y: 26} ] }, { type: "spline", dataPoints: [ { x: 10, y: 71 }, { x: 20, y: 55}, { x: 30, y: 50 }, { x: 40, y: 65 }, { x: 50, y: 95 }, { x: 60, y: 68 }, { x: 70, y: 28 }, { x: 80, y: 34 }, { x: 90, y: 14} ] } ] }); chart.render(); } </script> </head> <body> <div id="chartContainer" style="height: 400px; width: 100%;"></div> </body> </html>
I my question how to draw the graph in double line using canvas.js? Ans: only add the array function in my question to plot the graph based on array points.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Unable to draw linechart in react-native using canvas.js
Print canvas.js chart using js
Make bar chart using canvas.js
how to display table from chart js data in canvas.js using java script .?
Export multiple chart in a single page using canvas.js
Php and Html chart using Canvas.js using mysql database
How to create drill down chart in canvas.js?
Specifying IndexLabelPlacement at dataPointLevel in a doughnut chart, using canvas.js
How to draw an line arrow in canvas using fabric js?
How to draw a line graph using d3.js?
Related Tags