Line 105: | Line 105: | ||
<h2>Modeling.</h2> | <h2>Modeling.</h2> | ||
<p>Under construction...</p> | <p>Under construction...</p> | ||
+ | <!DOCTYPE HTML> | ||
+ | <html> | ||
+ | <head> | ||
+ | <title>CanvasJS Chart jQuery Plugin</title> | ||
+ | <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/jquery.canvasjs.min.js"></script> | ||
+ | <script type="text/javascript"> | ||
+ | window.onload = function () { | ||
+ | |||
+ | //Better to construct options first and then pass it as a parameter | ||
+ | var options = { | ||
+ | title: { | ||
+ | text: "Column Chart using jQuery Plugin" | ||
+ | }, | ||
+ | animationEnabled: true, | ||
+ | data: [ | ||
+ | { | ||
+ | type: "column", //change it to line, area, bar, pie, etc | ||
+ | dataPoints: [ | ||
+ | { x: 10, y: 10 }, | ||
+ | { x: 20, y: 11 }, | ||
+ | { x: 30, y: 14 }, | ||
+ | { x: 40, y: 16 }, | ||
+ | { x: 50, y: 19 }, | ||
+ | { x: 60, y: 15 }, | ||
+ | { x: 70, y: 12 }, | ||
+ | { x: 80, y: 10 } | ||
+ | ] | ||
+ | } | ||
+ | ] | ||
+ | }; | ||
+ | |||
+ | $("#chartContainer").CanvasJSChart(options); | ||
+ | |||
+ | } | ||
+ | </script> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div id="chartContainer" style="height: 300px; width: 100%;"></div> | ||
+ | </body> | ||
+ | |||
+ | </html> | ||
Revision as of 12:43, 22 August 2017
Modeling.
Under construction...
</div> </div> </section>
</html>