demoscriptablebubble.html 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <meta name="description" content="Example showing how to use TChartJS">
  7. <meta name="author" content="silvioprog">
  8. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
  9. <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js" integrity="sha256-oSgtFCCmHWRPQ/JmR4OoZ3Xke1Pw4v50uh6pLcu+fIc=" crossorigin="anonymous"></script>
  10. <script src="js/demoscriptablebubble.js"></script>
  11. <title>TChartJS example</title>
  12. <style>
  13. .title {
  14. margin: 20px 0 20px 0
  15. }
  16. .toolbar {
  17. margin: 0 0 20px 0
  18. }
  19. </style>
  20. </head>
  21. <body>
  22. <div class="container">
  23. <h3 class="title">
  24. TChartJS <small class="text-muted">Create scriptable bubble charts using Pas2JS & ChartJS (<a href="demoscriptablebubble.lpr">view source</a>)</small>
  25. </h3>
  26. <div class="content">
  27. <div class="toolbar">
  28. <button id="randomize" class="btn btn-primary">Randomize</button>
  29. <button id="addDataset" class="btn btn-primary">Add dataset</button>
  30. <button id="removeDataset" class="btn btn-primary">Remove dataset</button>
  31. </div>
  32. <div class="wrapper"><canvas id="chart-0"></canvas></div>
  33. </div>
  34. </div>
  35. <script>
  36. rtl.run();
  37. </script>
  38. </body>
  39. </html>