]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
improve scatter-multi-axis sample
authorVille Hämäläinen <hamalainen.ville.p@gmail.com>
Sun, 28 Feb 2016 08:09:14 +0000 (10:09 +0200)
committerVille Hämäläinen <hamalainen.ville.p@gmail.com>
Sun, 28 Feb 2016 08:09:14 +0000 (10:09 +0200)
- set title
- set same size canvas as other samples
- remove user select from canvas

samples/scatter-multi-axis.html

index 531ec38aff643b03a4e83cdd79838bec92e6fbf3..43d27e502284243dd08f978cf86819f4ecf8170a 100644 (file)
@@ -5,12 +5,19 @@
     <title>Scatter Chart Multi Axis</title>
     <script src="../dist/Chart.bundle.js"></script>
     <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+    <style>
+    canvas {
+        -moz-user-select: none;
+        -webkit-user-select: none;
+        -ms-user-select: none;
+    }
+    </style>
 </head>
 
 <body>
-    <div style="width:50%">
+    <div style="width:75%">
         <div>
-            <canvas id="canvas" height="450" width="600"></canvas>
+            <canvas id="canvas"></canvas>
         </div>
     </div>
     <button id="randomizeData">Randomize Data</button>
@@ -86,8 +93,6 @@
         dataset.pointBorderWidth = 1;
     });
 
-    console.log(scatterChartData);
-
     window.onload = function() {
         var ctx = document.getElementById("canvas").getContext("2d");
         window.myScatter = Chart.Scatter(ctx, {
                options: {
                    responsive: true,
                    hoverMode: 'single',
+               title: {
+                       display: true,
+                       text: 'Chart.js Scatter Chart - Multi Axis'
+                   },
                    scales: {
                        xAxes: [{
                                position: "bottom",
                }, {
                        x: randomScalingFactor(),
                        y: randomScalingFactor(),
-               }]
+               }];
         window.myScatter.update();
     });
     </script>