chartjs-plugin-autocolors 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -55,9 +55,9 @@ Single chart
|
|
|
55
55
|
```js
|
|
56
56
|
const chart = new Chart(ctx, {
|
|
57
57
|
// ...
|
|
58
|
-
plugins:
|
|
58
|
+
plugins: [
|
|
59
59
|
autocolors
|
|
60
|
-
|
|
60
|
+
]
|
|
61
61
|
});
|
|
62
62
|
```
|
|
63
63
|
|
|
@@ -125,6 +125,23 @@ const chart = new Chart(ctx, {
|
|
|
125
125
|
});
|
|
126
126
|
```
|
|
127
127
|
|
|
128
|
+
### Offset
|
|
129
|
+
|
|
130
|
+
`offset` option can be used to offset the color generation by a number of colors.
|
|
131
|
+
|
|
132
|
+
```js
|
|
133
|
+
const chart = new Chart(ctx, {
|
|
134
|
+
// ...
|
|
135
|
+
options: {
|
|
136
|
+
plugins: {
|
|
137
|
+
autocolors: {
|
|
138
|
+
offset: 5
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
```
|
|
144
|
+
|
|
128
145
|
## Browser compatibility
|
|
129
146
|
|
|
130
147
|
This plugin uses a generator function, so it is not compatible with Internet Explorer.
|
|
@@ -1,46 +1,45 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* chartjs-plugin-autocolors v0.0.
|
|
2
|
+
* chartjs-plugin-autocolors v0.0.6
|
|
3
3
|
* https://github.com/kurkle/chartjs-plugin-autocolors#readme
|
|
4
|
-
* (c)
|
|
4
|
+
* (c) 2022 Jukka Kurkela
|
|
5
5
|
* Released under the MIT License
|
|
6
6
|
*/
|
|
7
7
|
/*!
|
|
8
|
-
* @kurkle/color v0.1
|
|
8
|
+
* @kurkle/color v0.2.1
|
|
9
9
|
* https://github.com/kurkle/color#readme
|
|
10
|
-
* (c)
|
|
10
|
+
* (c) 2022 Jukka Kurkela
|
|
11
11
|
* Released under the MIT License
|
|
12
12
|
*/
|
|
13
|
-
|
|
14
13
|
function round(v) {
|
|
15
|
-
|
|
14
|
+
return v + 0.5 | 0;
|
|
16
15
|
}
|
|
17
16
|
const lim = (v, l, h) => Math.max(Math.min(v, h), l);
|
|
18
17
|
function n2b(v) {
|
|
19
|
-
|
|
18
|
+
return lim(round(v * 255), 0, 255);
|
|
20
19
|
}
|
|
21
20
|
function b2n(v) {
|
|
22
|
-
|
|
23
|
-
}
|
|
24
|
-
function rgbString(v) {
|
|
25
|
-
return v && (
|
|
26
|
-
v.a < 255
|
|
27
|
-
? `rgba(${v.r}, ${v.g}, ${v.b}, ${b2n(v.a)})`
|
|
28
|
-
: `rgb(${v.r}, ${v.g}, ${v.b})`
|
|
29
|
-
);
|
|
21
|
+
return lim(round(v / 2.55) / 100, 0, 1);
|
|
30
22
|
}
|
|
31
23
|
function hsv2rgbn(h, s, v) {
|
|
32
|
-
|
|
33
|
-
|
|
24
|
+
const f = (n, k = (n + h / 60) % 6) => v - v * s * Math.max(Math.min(k, 4 - k, 1), 0);
|
|
25
|
+
return [f(5), f(3), f(1)];
|
|
34
26
|
}
|
|
35
27
|
function calln(f, a, b, c) {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
28
|
+
return (
|
|
29
|
+
Array.isArray(a)
|
|
30
|
+
? f(a[0], a[1], a[2])
|
|
31
|
+
: f(a, b, c)
|
|
32
|
+
).map(n2b);
|
|
41
33
|
}
|
|
42
34
|
function hsv2rgb(h, s, v) {
|
|
43
|
-
|
|
35
|
+
return calln(hsv2rgbn, h, s, v);
|
|
36
|
+
}
|
|
37
|
+
function rgbString(v) {
|
|
38
|
+
return v && (
|
|
39
|
+
v.a < 255
|
|
40
|
+
? `rgba(${v.r}, ${v.g}, ${v.b}, ${b2n(v.a)})`
|
|
41
|
+
: `rgb(${v.r}, ${v.g}, ${v.b})`
|
|
42
|
+
);
|
|
44
43
|
}
|
|
45
44
|
|
|
46
45
|
function* hueGen() {
|
|
@@ -88,6 +87,11 @@ var index = {
|
|
|
88
87
|
}
|
|
89
88
|
|
|
90
89
|
const color = colorGen();
|
|
90
|
+
if (options.offset) {
|
|
91
|
+
for (let i = 0; i < options.offset; i++) {
|
|
92
|
+
color.next();
|
|
93
|
+
}
|
|
94
|
+
}
|
|
91
95
|
|
|
92
96
|
for (const dataset of chart.data.datasets) {
|
|
93
97
|
if (dataset.backgroundColor && dataset.borderColor) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* chartjs-plugin-autocolors v0.0.
|
|
2
|
+
* chartjs-plugin-autocolors v0.0.6
|
|
3
3
|
* https://github.com/kurkle/chartjs-plugin-autocolors#readme
|
|
4
|
-
* (c)
|
|
4
|
+
* (c) 2022 Jukka Kurkela
|
|
5
5
|
* Released under the MIT License
|
|
6
6
|
*/
|
|
7
7
|
(function (global, factory) {
|
|
@@ -11,42 +11,41 @@ typeof define === 'function' && define.amd ? define(factory) :
|
|
|
11
11
|
})(this, (function () { 'use strict';
|
|
12
12
|
|
|
13
13
|
/*!
|
|
14
|
-
* @kurkle/color v0.1
|
|
14
|
+
* @kurkle/color v0.2.1
|
|
15
15
|
* https://github.com/kurkle/color#readme
|
|
16
|
-
* (c)
|
|
16
|
+
* (c) 2022 Jukka Kurkela
|
|
17
17
|
* Released under the MIT License
|
|
18
18
|
*/
|
|
19
|
-
|
|
20
19
|
function round(v) {
|
|
21
|
-
|
|
20
|
+
return v + 0.5 | 0;
|
|
22
21
|
}
|
|
23
22
|
const lim = (v, l, h) => Math.max(Math.min(v, h), l);
|
|
24
23
|
function n2b(v) {
|
|
25
|
-
|
|
24
|
+
return lim(round(v * 255), 0, 255);
|
|
26
25
|
}
|
|
27
26
|
function b2n(v) {
|
|
28
|
-
|
|
29
|
-
}
|
|
30
|
-
function rgbString(v) {
|
|
31
|
-
return v && (
|
|
32
|
-
v.a < 255
|
|
33
|
-
? `rgba(${v.r}, ${v.g}, ${v.b}, ${b2n(v.a)})`
|
|
34
|
-
: `rgb(${v.r}, ${v.g}, ${v.b})`
|
|
35
|
-
);
|
|
27
|
+
return lim(round(v / 2.55) / 100, 0, 1);
|
|
36
28
|
}
|
|
37
29
|
function hsv2rgbn(h, s, v) {
|
|
38
|
-
|
|
39
|
-
|
|
30
|
+
const f = (n, k = (n + h / 60) % 6) => v - v * s * Math.max(Math.min(k, 4 - k, 1), 0);
|
|
31
|
+
return [f(5), f(3), f(1)];
|
|
40
32
|
}
|
|
41
33
|
function calln(f, a, b, c) {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
34
|
+
return (
|
|
35
|
+
Array.isArray(a)
|
|
36
|
+
? f(a[0], a[1], a[2])
|
|
37
|
+
: f(a, b, c)
|
|
38
|
+
).map(n2b);
|
|
47
39
|
}
|
|
48
40
|
function hsv2rgb(h, s, v) {
|
|
49
|
-
|
|
41
|
+
return calln(hsv2rgbn, h, s, v);
|
|
42
|
+
}
|
|
43
|
+
function rgbString(v) {
|
|
44
|
+
return v && (
|
|
45
|
+
v.a < 255
|
|
46
|
+
? `rgba(${v.r}, ${v.g}, ${v.b}, ${b2n(v.a)})`
|
|
47
|
+
: `rgb(${v.r}, ${v.g}, ${v.b})`
|
|
48
|
+
);
|
|
50
49
|
}
|
|
51
50
|
|
|
52
51
|
function* hueGen() {
|
|
@@ -94,6 +93,11 @@ var index = {
|
|
|
94
93
|
}
|
|
95
94
|
|
|
96
95
|
const color = colorGen();
|
|
96
|
+
if (options.offset) {
|
|
97
|
+
for (let i = 0; i < options.offset; i++) {
|
|
98
|
+
color.next();
|
|
99
|
+
}
|
|
100
|
+
}
|
|
97
101
|
|
|
98
102
|
for (const dataset of chart.data.datasets) {
|
|
99
103
|
if (dataset.backgroundColor && dataset.borderColor) {
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* chartjs-plugin-autocolors v0.0.
|
|
2
|
+
* chartjs-plugin-autocolors v0.0.6
|
|
3
3
|
* https://github.com/kurkle/chartjs-plugin-autocolors#readme
|
|
4
|
-
* (c)
|
|
4
|
+
* (c) 2022 Jukka Kurkela
|
|
5
5
|
* Released under the MIT License
|
|
6
6
|
*/
|
|
7
7
|
!function(o,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(o="undefined"!=typeof globalThis?globalThis:o||self)["chartjs-plugin-autocolors"]=t()}(this,(function(){"use strict";
|
|
8
8
|
/*!
|
|
9
|
-
* @kurkle/color v0.1
|
|
9
|
+
* @kurkle/color v0.2.1
|
|
10
10
|
* https://github.com/kurkle/color#readme
|
|
11
|
-
* (c)
|
|
11
|
+
* (c) 2022 Jukka Kurkela
|
|
12
12
|
* Released under the MIT License
|
|
13
|
-
*/function o(o){return o+.5|0}const t=(o,t,n)=>Math.max(Math.min(o,n),t);function n(n){return t(o(255*n),0,255)}function e(
|
|
13
|
+
*/function o(o){return o+.5|0}const t=(o,t,n)=>Math.max(Math.min(o,n),t);function n(n){return t(o(255*n),0,255)}function e(o,t,n){const e=(e,r=(e+o/60)%6)=>n-n*t*Math.max(Math.min(r,4-r,1),0);return[e(5),e(3),e(1)]}function r(o,t,r){return a=e,d=o,u=t,c=r,(Array.isArray(d)?a(d[0],d[1],d[2]):a(d,u,c)).map(n);var a,d,u,c}function a(n){return n&&(n.a<255?`rgba(${n.r}, ${n.g}, ${n.b}, ${function(n){return t(o(n/2.55)/100,0,1)}(n.a)})`:`rgb(${n.r}, ${n.g}, ${n.b})`)}function d(o,t,n){o.backgroundColor=o.backgroundColor||t,o.borderColor=o.borderColor||n}function u(o,t,n){const e=o.next().value;return"function"==typeof t?t(Object.assign({colors:e},n)):e}return{id:"autocolors",beforeUpdate(o,t,n){const{mode:e="dataset",enabled:c=!0,customize:f}=n;if(!c)return;const i=function*(){const o=function*(){yield 0;for(let o=1;o<10;o++){const t=1<<o;for(let o=1;o<=t;o+=2)yield o/t}}();let t=o.next();for(;!t.done;){let n=r(Math.round(360*t.value),.6,.8);yield{background:a({r:n[0],g:n[1],b:n[2],a:192}),border:a({r:n[0],g:n[1],b:n[2],a:144})},n=r(Math.round(360*t.value),.6,.5),yield{background:a({r:n[0],g:n[1],b:n[2],a:192}),border:a({r:n[0],g:n[1],b:n[2],a:144})},t=o.next()}}();if(n.offset)for(let o=0;o<n.offset;o++)i.next();for(const t of o.data.datasets)if(!t.backgroundColor||!t.borderColor)if("dataset"===e){const n=u(i,f,{chart:o,datasetIndex:t.index});d(t,n.background,n.border)}else{const n=[],e=[];for(let r=0;r<t.data.length;r++){const a=u(i,f,{chart:o,datasetIndex:t.index,dataIndex:r});n.push(a.background),e.push(a.border)}d(t,n,e)}}}}));
|
|
14
14
|
//# sourceMappingURL=chartjs-plugin-autocolors.min.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "chartjs-plugin-autocolors",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"description": "Automatic color generation for Chart.js",
|
|
5
5
|
"main": "dist/chartjs-plugin-autocolors.js",
|
|
6
6
|
"module": "dist/chartjs-plugin-autocolors.esm.js",
|
|
@@ -30,9 +30,9 @@
|
|
|
30
30
|
},
|
|
31
31
|
"homepage": "https://github.com/kurkle/chartjs-plugin-autocolors#readme",
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@kurkle/color": "^0.1
|
|
33
|
+
"@kurkle/color": "^0.2.1",
|
|
34
34
|
"@rollup/plugin-node-resolve": "^13.0.4",
|
|
35
|
-
"eslint": "^8.
|
|
35
|
+
"eslint": "^8.17.0",
|
|
36
36
|
"eslint-config-chartjs": "^0.3.0",
|
|
37
37
|
"eslint-plugin-es": "^4.1.0",
|
|
38
38
|
"eslint-plugin-html": "^6.1.2",
|