]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Update colours + example values in docs
authorNick Downie <nick@nickdownie.com>
Sat, 23 Apr 2016 13:25:58 +0000 (14:25 +0100)
committerNick Downie <nick@nickdownie.com>
Sat, 23 Apr 2016 13:25:58 +0000 (14:25 +0100)
docs/02-Line-Chart.md
docs/03-Bar-Chart.md
docs/04-Radar-Chart.md
docs/05-Polar-Area-Chart.md
docs/06-Pie-Doughnut-Chart.md

index aa10c4d8fff2a30f29b5021e76b768db2d1c79f3..4f03fd46206a45b6805946a15855316817facd9c 100644 (file)
@@ -37,17 +37,17 @@ var data = {
                        label: "My First dataset",
 
                        // Boolean - if true fill the area under the line
-                       fill: false,\r
-\r
-                       // Tension - bezier curve tension of the line. Set to 0 to draw straight lines connecting points\r
-                       // Used to be called "tension" but was renamed for consistency. The old option name continues to work for compatibility.\r
-                       lineTension: 0.1,\r
+                       fill: false,
+
+                       // Tension - bezier curve tension of the line. Set to 0 to draw straight lines connecting points
+                       // Used to be called "tension" but was renamed for consistency. The old option name continues to work for compatibility.
+                       lineTension: 0.1,
 
                        // String - the color to fill the area under the line with if fill is true
-                       backgroundColor: "rgba(220,220,220,0.2)",\r
+                       backgroundColor: "rgba(75,192,192,0.4)",
 
-                       // String - Line color\r
-                       borderColor: "rgba(220,220,220,1)",
+                       // String - Line color
+                       borderColor: "rgba(75,192,192,1)",
 
                        // String - cap style of the line. See https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineCap
                        borderCapStyle: 'butt',
@@ -59,39 +59,39 @@ var data = {
                        borderDashOffset: 0.0,
 
                        // String - line join style. See https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineJoin
-                       borderJoinStyle: 'miter',\r
-\r
-                       // The properties below allow an array to be specified to change the value of the item at the given index\r
+                       borderJoinStyle: 'miter',
+
+                       // The properties below allow an array to be specified to change the value of the item at the given index
 
-                       // String or Array - Point stroke color\r
-                       pointBorderColor: "rgba(220,220,220,1)",
+                       // String or Array - Point stroke color
+                       pointBorderColor: "rgba(75,192,192,1)",
 
-                       // String or Array - Point fill color\r
+                       // String or Array - Point fill color
                        pointBackgroundColor: "#fff",
 
-                       // Number or Array - Stroke width of point border\r
+                       // Number or Array - Stroke width of point border
                        pointBorderWidth: 1,
 
-                       // Number or Array - Radius of point when hovered\r
+                       // Number or Array - Radius of point when hovered
                        pointHoverRadius: 5,
 
-                       // String or Array - point background color when hovered\r
-                       pointHoverBackgroundColor: "rgba(220,220,220,1)",
+                       // String or Array - point background color when hovered
+                       pointHoverBackgroundColor: "rgba(75,192,192,1)",
 
-                       // String or Array - Point border color when hovered\r
+                       // String or Array - Point border color when hovered
                        pointHoverBorderColor: "rgba(220,220,220,1)",
 
-                       // Number or Array - border width of point when hovered\r
-                       pointHoverBorderWidth: 2,\r
+                       // Number or Array - border width of point when hovered
+                       pointHoverBorderWidth: 2,
+
+                       // Number or Array - the pixel size of the point shape. Can be set to 0 to not render a circle over the point
+                       // Used to be called "radius" but was renamed for consistency. The old option name continues to work for compatibility.
+                       pointRadius: 1,
 
-                       // Number or Array - the pixel size of the point shape. Can be set to 0 to not render a circle over the point\r
-                       // Used to be called "radius" but was renamed for consistency. The old option name continues to work for compatibility.\r
-                       pointRadius: 1,\r
-\r
-                       // Number or Array - the pixel size of the non-displayed point that reacts to mouse hover events\r
-                       //\r
-                       // Used to be called "hitRadius" but was renamed for consistency. The old option name continues to work for compatibility.\r
-                       pointHitRadius: 10,\r
+                       // Number or Array - the pixel size of the non-displayed point that reacts to mouse hover events
+                       //
+                       // Used to be called "hitRadius" but was renamed for consistency. The old option name continues to work for compatibility.
+                       pointHitRadius: 10,
 
                        // The actual data
                        data: [65, 59, 80, 81, 56, 55, 40],
@@ -102,14 +102,14 @@ var data = {
                {
                        label: "My Second dataset",
                        fill: false,
-                       backgroundColor: "rgba(220,220,220,0.2)",
-                       borderColor: "rgba(220,220,220,1)",
-                       pointBorderColor: "rgba(220,220,220,1)",
+                       backgroundColor: "rgba(255,205,86,0.4)",
+                       borderColor: "rgba(255,205,86,1)",
+                       pointBorderColor: "rgba(255,205,86,1)",
                        pointBackgroundColor: "#fff",
                        pointBorderWidth: 1,
                        pointHoverRadius: 5,
-                       pointHoverBackgroundColor: "rgba(220,220,220,1)",
-                       pointHoverBorderColor: "rgba(220,220,220,1)",
+                       pointHoverBackgroundColor: "rgba(255,205,86,1)",
+                       pointHoverBorderColor: "rgba(255,205,86,1)",
                        pointHoverBorderWidth: 2,
                        data: [28, 48, 40, 19, 86, 27, 90]
                }
index d59a63715fe4cb94d5d789e1eb29cc49d69d04f1..dab2de5bd58422bc5088ee5156ad8b10fc187760 100644 (file)
@@ -32,19 +32,19 @@ var data = {
 
                        // The properties below allow an array to be specified to change the value of the item at the given index
                        // String  or array - the bar color
-                       backgroundColor: "rgba(220,220,220,0.2)",
+                       backgroundColor: "rgba(255,99,132,0.2)",
 
                        // String or array - bar stroke color
-                       borderColor: "rgba(220,220,220,1)",
+                       borderColor: "rgba(255,99,132,1)",
 
                        // Number or array - bar border width
                        borderWidth: 1,
 
                        // String or array - fill color when hovered
-                       hoverBackgroundColor: "rgba(220,220,220,0.2)",
+                       hoverBackgroundColor: "rgba(255,99,132,0.4)",
 
                        // String or array - border color when hovered
-                       hoverBorderColor: "rgba(220,220,220,1)",
+                       hoverBorderColor: "rgba(255,99,132,1)",
 
                        // The actual data
                        data: [65, 59, 80, 81, 56, 55, 40],
@@ -54,11 +54,11 @@ var data = {
                },
                {
                        label: "My Second dataset",
-                       backgroundColor: "rgba(220,220,220,0.2)",
-                       borderColor: "rgba(220,220,220,1)",
+                       backgroundColor: "rgba(54,162,235,0.2)",
+                       borderColor: "rgba(54,162,235,1)",
                        borderWidth: 1,
-                       hoverBackgroundColor: "rgba(220,220,220,0.2)",
-                       hoverBorderColor: "rgba(220,220,220,1)",
+                       hoverBackgroundColor: "rgba(54,162,235,0.4)",
+                       hoverBorderColor: "rgba(54,162,235,1)",
                        data: [28, 48, 40, 19, 86, 27, 90]
                }
        ]
index 939a69e55e2628dd31564a0ebb01a7ae7d80d9d6..cdf04f3956247c7a9ea145cea163cc20fac1829b 100644 (file)
@@ -29,22 +29,22 @@ var data = {
        datasets: [
                {
                        label: "My First dataset",
-                       backgroundColor: "rgba(220,220,220,0.2)",
-                       borderColor: "rgba(220,220,220,1)",
-                       pointBackgroundColor: "rgba(220,220,220,1)",
+                       backgroundColor: "rgba(179,181,198,0.2)",
+                       borderColor: "rgba(179,181,198,1)",
+                       pointBackgroundColor: "rgba(179,181,198,1)",
                        pointBorderColor: "#fff",
                        pointHoverBackgroundColor: "#fff",
-                       pointHoverBorderColor: "rgba(220,220,220,1)",
+                       pointHoverBorderColor: "rgba(179,181,198,1)",
                        data: [65, 59, 90, 81, 56, 55, 40]
                },
                {
                        label: "My Second dataset",
-                       backgroundColor: "rgba(151,187,205,0.2)",
-                       borderColor: "rgba(151,187,205,1)",
-                       pointBackgroundColor: "rgba(151,187,205,1)",
+                       backgroundColor: "rgba(255,99,132,0.2)",
+                       borderColor: "rgba(255,99,132,1)",
+                       pointBackgroundColor: "rgba(255,99,132,1)",
                        pointBorderColor: "#fff",
                        pointHoverBackgroundColor: "#fff",
-                       pointHoverBorderColor: "rgba(151,187,205,1)",
+                       pointHoverBorderColor: "rgba(255,99,132,1)",
                        data: [28, 48, 40, 19, 96, 27, 100]
                }
        ]
index fb2a44a3a286f56bf99b54f6250071be5d63194f..c3d696d87340ef0c9b555dc87e3b09fd5b6d6deb 100644 (file)
@@ -27,18 +27,18 @@ new Chart(ctx, {
 var data = {
        datasets: [{
                data: [
-                       10,
-                       32,
-                       53,
-                       14,
-                       22,
+                       11,
+                       16,
+                       7,
+                       3,
+                       14
                ],
                backgroundColor: [
-                       "#F7464A",
-                       "#46BFBD",
-                       "#FDB45C",
-                       "#949FB1",
-                       "#4D5360",
+                       "#FF6384",
+                       "#4BC0C0",
+                       "#FFCE56",
+                       "#E7E9ED",
+                       "#36A2EB"
                ],
                label: 'My dataset' // for legend
        }],
@@ -47,7 +47,7 @@ var data = {
                "Green",
                "Yellow",
                "Grey",
-               "Dark Grey"
+               "Blue"
        ]
 };
 ```
index b54c1bcfefd536477e45a1f61467c9e5051772e2..b1fef22887b7d5565b3710fdbdbcb3683b99f5e8 100644 (file)
@@ -53,14 +53,14 @@ var data = {
         {
             data: [300, 50, 100],
             backgroundColor: [
-                "#F7464A",
-                "#46BFBD",
-                "#FDB45C"
+                "#FF6384",
+                "#36A2EB",
+                "#FFCE56"
             ],
             hoverBackgroundColor: [
-                "#FF5A5E",
-                "#5AD3D1",
-                "#FFC870"
+                "#FF6384",
+                "#36A2EB",
+                "#FFCE56"
             ]
         }]
 };