chartjs-chart-matrix 1.1.0 → 1.2.0

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.
Files changed (7) hide show
  1. package/README.md +49 -41
  2. package/dist/chartjs-chart-matrix.esm.js +25 -5
  3. package/dist/chartjs-chart-matrix.js +28 -8
  4. package/dist/chartjs-chart-matrix.min.js +3 -3
  5. package/dist/chartjs-chart-matrix.min.js.map +1 -0
  6. package/package.json +15 -15
  7. package/types/index.esm.d.ts +1 -1
package/README.md CHANGED
@@ -6,56 +6,64 @@
6
6
  [![release](https://img.shields.io/github/release/kurkle/chartjs-chart-matrix.svg?style=flat-square)](https://github.com/kurkle/chartjs-chart-matrix/releases/latest)
7
7
  ![npm bundle size](https://img.shields.io/bundlephobia/min/chartjs-chart-matrix.svg)
8
8
  ![GitHub](https://img.shields.io/github/license/kurkle/chartjs-chart-matrix.svg)
9
- [![Coverage Status](https://coveralls.io/repos/github/kurkle/chartjs-chart-matrix/badge.svg?branch=next)](https://coveralls.io/github/kurkle/chartjs-chart-matrix?branch=next)
9
+ [![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=kurkle_chartjs-chart-matrix&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=kurkle_chartjs-chart-matrix)
10
10
  [![documentation](https://img.shields.io/static/v1?message=Documentation&color=informational)](https://chartjs-chart-matrix.pages.dev)
11
11
 
12
- ## Documentation
12
+ ## Example
13
13
 
14
- To create a matrix chart, include `chartjs-chart-matrix.js` after `chart.js` and then create the chart by setting the `type` attribute to `'matrix'`
14
+ ![Matrix Example Image](matrix.png)
15
15
 
16
- ```js
17
- const chart = new Chart(ctx, {
18
- type: 'matrix',
19
- data: dataObject
20
- });
21
- ```
16
+ ## Documentation
22
17
 
23
- ## Configuration
24
-
25
- Matrix chart allows configuration of `width` and `height` of the data points in addition to standard Chart.js configuration.
26
-
27
- ```js
28
- const chart = new Chart(ctx, {
29
- type: 'matrix',
30
- data: {
31
- datasets: [{
32
- label: 'My Matrix',
33
- data: [
34
- {x: 1, y: 1, v: 11},
35
- {x: 2, y: 2, v: 22},
36
- {x: 3, y: 3, v: 33}
37
- ],
38
- backgroundColor: function(ctx) {
39
- var value = ctx.dataset.data[ctx.dataIndex].v;
40
- var alpha = (value - 5) / 40;
41
- return Color('green').alpha(alpha).rgbString();
18
+ You can find documentation for chartjs-chart-treemap at [https://chartjs-chart-matrix.pages.dev/](https://chartjs-chart-matrix.pages.dev/).
19
+
20
+ ## Quickstart
21
+
22
+ ```html
23
+ <html>
24
+ <head>
25
+ <script src="https://cdn.jsdelivr.net/npm/chart.js@3.7"></script>
26
+ <script src="https://cdn.jsdelivr.net/npm/chartjs-chart-matrix@1.1"></script>
27
+ </head>
28
+ <body>
29
+ <div class="chart-container">
30
+ <canvas id="matrix-chart">
31
+ </div>
32
+ <script>
33
+ const chart = new Chart('matrix-chart', {
34
+ type: 'matrix',
35
+ data: {
36
+ datasets: [{
37
+ label: 'Basic matrix',
38
+ data: [{x: 1, y: 1}, {x: 2, y: 1}, {x: 1, y: 2}, {x: 2, y: 2}],
39
+ borderWidth: 1,
40
+ borderColor: 'rgba(0,0,0,0.5)',
41
+ backgroundColor: 'rgba(200,200,0,0.3)',
42
+ width: ({chart}) => (chart.chartArea || {}).width / 2 - 1,
43
+ height: ({chart}) => (chart.chartArea || {}).height / 2 - 1,
44
+ }],
42
45
  },
43
- width: function(ctx) {
44
- var a = ctx.chart.chartArea;
45
- return (a.right - a.left) / 3.5;
46
- },
47
- height: function(ctx) {
48
- var a = ctx.chart.chartArea;
49
- return (a.bottom - a.top) / 3.5;
46
+ options: {
47
+ scales: {
48
+ x: {
49
+ display: false,
50
+ min: 0.5,
51
+ max: 2.5,
52
+ offset: false
53
+ },
54
+ y: {
55
+ display: false,
56
+ min: 0.5,
57
+ max: 2.5
58
+ }
59
+ }
50
60
  }
51
- }]
52
- },
53
- });
61
+ });
62
+ </script>
63
+ </body>
54
64
  ```
55
65
 
56
- ## Example
57
-
58
- ![Matrix Example Image](matrix.png)
66
+ This simple example is also available online in the documentation: https://chartjs-chart-matrix.pages.dev/usage.html
59
67
 
60
68
  ## Development
61
69
 
package/dist/chartjs-chart-matrix.esm.js CHANGED
@@ -1,13 +1,13 @@
1
1
  /*!
2
- * chartjs-chart-matrix v1.1.0
2
+ * chartjs-chart-matrix v1.2.0
3
3
  * https://chartjs-chart-matrix.pages.dev/
4
- * (c) 2021 Jukka Kurkela
4
+ * (c) 2022 Jukka Kurkela
5
5
  * Released under the MIT license
6
6
  */
7
7
  import { DatasetController, Element } from 'chart.js';
8
8
  import { toTRBLCorners, addRoundedRectPath, isObject } from 'chart.js/helpers';
9
9
 
10
- var version = "1.1.0";
10
+ var version = "1.2.0";
11
11
 
12
12
  class MatrixController extends DatasetController {
13
13
  initialize() {
@@ -36,8 +36,8 @@ class MatrixController extends DatasetController {
36
36
  const options = me.resolveDataElementOptions(i, mode);
37
37
  const {width, height, anchorX, anchorY} = options;
38
38
  const properties = {
39
- x: anchorX === 'left' ? x : x - width / (anchorX === 'right' ? 1 : 2),
40
- y: anchorY === 'top' ? y : y - height / (anchorY === 'bottom' ? 1 : 2),
39
+ x: resolveX(anchorX, x, width),
40
+ y: resolveY(anchorY, y, height),
41
41
  width,
42
42
  height,
43
43
  options
@@ -59,6 +59,26 @@ class MatrixController extends DatasetController {
59
59
  }
60
60
  }
61
61
 
62
+ function resolveX(anchorX, x, width) {
63
+ if (anchorX === 'left' || anchorX === 'start') {
64
+ return x;
65
+ }
66
+ if (anchorX === 'right' || anchorX === 'end') {
67
+ return x - width;
68
+ }
69
+ return x - width / 2;
70
+ }
71
+
72
+ function resolveY(anchorY, y, height) {
73
+ if (anchorY === 'top' || anchorY === 'start') {
74
+ return y;
75
+ }
76
+ if (anchorY === 'bottom' || anchorY === 'end') {
77
+ return y - height;
78
+ }
79
+ return y - height / 2;
80
+ }
81
+
62
82
  MatrixController.id = 'matrix';
63
83
 
64
84
  MatrixController.version = version;
package/dist/chartjs-chart-matrix.js CHANGED
@@ -1,20 +1,20 @@
1
1
  /*!
2
- * chartjs-chart-matrix v1.1.0
2
+ * chartjs-chart-matrix v1.2.0
3
3
  * https://chartjs-chart-matrix.pages.dev/
4
- * (c) 2021 Jukka Kurkela
4
+ * (c) 2022 Jukka Kurkela
5
5
  * Released under the MIT license
6
6
  */
7
7
  (function (global, factory) {
8
8
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(require('chart.js'), require('chart.js/helpers')) :
9
9
  typeof define === 'function' && define.amd ? define(['chart.js', 'chart.js/helpers'], factory) :
10
10
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Chart, global.Chart.helpers));
11
- }(this, (function (Chart, helpers) { 'use strict';
11
+ })(this, (function (Chart, helpers) { 'use strict';
12
12
 
13
13
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
14
 
15
15
  var Chart__default = /*#__PURE__*/_interopDefaultLegacy(Chart);
16
16
 
17
- var version = "1.1.0";
17
+ var version = "1.2.0";
18
18
 
19
19
  class MatrixController extends Chart.DatasetController {
20
20
  initialize() {
@@ -43,8 +43,8 @@ class MatrixController extends Chart.DatasetController {
43
43
  const options = me.resolveDataElementOptions(i, mode);
44
44
  const {width, height, anchorX, anchorY} = options;
45
45
  const properties = {
46
- x: anchorX === 'left' ? x : x - width / (anchorX === 'right' ? 1 : 2),
47
- y: anchorY === 'top' ? y : y - height / (anchorY === 'bottom' ? 1 : 2),
46
+ x: resolveX(anchorX, x, width),
47
+ y: resolveY(anchorY, y, height),
48
48
  width,
49
49
  height,
50
50
  options
@@ -66,6 +66,26 @@ class MatrixController extends Chart.DatasetController {
66
66
  }
67
67
  }
68
68
 
69
+ function resolveX(anchorX, x, width) {
70
+ if (anchorX === 'left' || anchorX === 'start') {
71
+ return x;
72
+ }
73
+ if (anchorX === 'right' || anchorX === 'end') {
74
+ return x - width;
75
+ }
76
+ return x - width / 2;
77
+ }
78
+
79
+ function resolveY(anchorY, y, height) {
80
+ if (anchorY === 'top' || anchorY === 'start') {
81
+ return y;
82
+ }
83
+ if (anchorY === 'bottom' || anchorY === 'end') {
84
+ return y - height;
85
+ }
86
+ return y - height / 2;
87
+ }
88
+
69
89
  MatrixController.id = 'matrix';
70
90
 
71
91
  MatrixController.version = version;
@@ -249,6 +269,6 @@ MatrixElement.defaults = {
249
269
  height: 20
250
270
  };
251
271
 
252
- Chart__default['default'].register(MatrixController, MatrixElement);
272
+ Chart__default["default"].register(MatrixController, MatrixElement);
253
273
 
254
- })));
274
+ }));
package/dist/chartjs-chart-matrix.min.js CHANGED
@@ -1,8 +1,8 @@
1
1
  /*!
2
- * chartjs-chart-matrix v1.1.0
2
+ * chartjs-chart-matrix v1.2.0
3
3
  * https://chartjs-chart-matrix.pages.dev/
4
- * (c) 2021 Jukka Kurkela
4
+ * (c) 2022 Jukka Kurkela
5
5
  * Released under the MIT license
6
6
  */
7
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("chart.js"),require("chart.js/helpers")):"function"==typeof define&&define.amd?define(["chart.js","chart.js/helpers"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Chart,t.Chart.helpers)}(this,(function(t,e){"use strict";function i(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var r=i(t);class o extends t.DatasetController{initialize(){this.enableOptionSharing=!0,super.initialize()}update(t){const e=this._cachedMeta;this.updateElements(e.data,0,e.data.length,t)}updateElements(t,e,i,r){const o=this,n="reset"===r,{xScale:a,yScale:h}=o._cachedMeta,s=o.resolveDataElementOptions(e,r),d=o.getSharedOptions(r,t[e],s);for(let s=e;s<e+i;s++){const e=!n&&o.getParsed(s),i=n?a.getBasePixel():a.getPixelForValue(e.x),d=n?h.getBasePixel():h.getPixelForValue(e.y),l=o.resolveDataElementOptions(s,r),{width:u,height:c,anchorX:g,anchorY:f}=l,p={x:"left"===g?i:i-u/("right"===g?1:2),y:"top"===f?d:d-c/("bottom"===f?1:2),width:u,height:c,options:l};o.updateElement(t[s],s,p,r)}o.updateSharedOptions(d,r)}draw(){const t=this,e=t.getMeta().data||[];let i,r;for(i=0,r=e.length;i<r;++i)e[i].draw(t._ctx)}}function n(t,e){const{x:i,y:r,width:o,height:n}=t.getProps(["x","y","width","height"],e);return{left:i,top:r,right:i+o,bottom:r+n}}function a(t,e,i){return Math.max(Math.min(t,i),e)}function h(t){const i=n(t),r=i.right-i.left,o=i.bottom-i.top,h=function(t,i,r){const o=t.options.borderWidth;let n,h,s,d;return e.isObject(o)?(n=+o.top||0,h=+o.right||0,s=+o.bottom||0,d=+o.left||0):n=h=s=d=+o||0,{t:a(n,0,r),r:a(h,0,i),b:a(s,0,r),l:a(d,0,i)}}(t,r/2,o/2);return{outer:{x:i.left,y:i.top,w:r,h:o},inner:{x:i.left+h.l,y:i.top+h.t,w:r-h.l-h.r,h:o-h.t-h.b}}}function s(t,e,i,r){const o=null===e,a=null===i,h=!(!t||o&&a)&&n(t,r);return h&&(o||e>=h.left&&e<=h.right)&&(a||i>=h.top&&i<=h.bottom)}o.id="matrix",o.version="1.1.0",o.defaults={dataElementType:"matrix",animations:{numbers:{type:"number",properties:["x","y","width","height"]}},anchorX:"center",anchorY:"center"},o.overrides={interaction:{mode:"nearest",intersect:!0},scales:{x:{type:"linear",offset:!0},y:{type:"linear",reverse:!0}}};class d extends t.Element{constructor(t){super(),this.options=void 0,this.width=void 0,this.height=void 0,t&&Object.assign(this,t)}draw(t){const i=this.options,{inner:r,outer:o}=h(this),n=e.toTRBLCorners(i.borderRadius);t.save(),o.w!==r.w||o.h!==r.h?(t.beginPath(),e.addRoundedRectPath(t,{x:o.x,y:o.y,w:o.w,h:o.h,radius:n}),e.addRoundedRectPath(t,{x:r.x,y:r.y,w:r.w,h:r.h,radius:n}),t.fillStyle=i.backgroundColor,t.fill(),t.fillStyle=i.borderColor,t.fill("evenodd")):(t.beginPath(),e.addRoundedRectPath(t,{x:r.x,y:r.y,w:r.w,h:r.h,radius:n}),t.fillStyle=i.backgroundColor,t.fill()),t.restore()}inRange(t,e,i){return s(this,t,e,i)}inXRange(t,e){return s(this,t,null,e)}inYRange(t,e){return s(this,null,t,e)}getCenterPoint(t){const{x:e,y:i,width:r,height:o}=this.getProps(["x","y","width","height"],t);return{x:e+r/2,y:i+o/2}}tooltipPosition(){return this.getCenterPoint()}getRange(t){return"x"===t?this.width/2:this.height/2}}d.id="matrix",d.defaults={backgroundColor:void 0,borderColor:void 0,borderWidth:void 0,borderRadius:0,anchorX:void 0,anchorY:void 0,width:20,height:20},r.default.register(o,d)}));
7
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("chart.js"),require("chart.js/helpers")):"function"==typeof define&&define.amd?define(["chart.js","chart.js/helpers"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Chart,t.Chart.helpers)}(this,(function(t,e){"use strict";function i(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var r=i(t);class n extends t.DatasetController{initialize(){this.enableOptionSharing=!0,super.initialize()}update(t){const e=this._cachedMeta;this.updateElements(e.data,0,e.data.length,t)}updateElements(t,e,i,r){const n=this,s="reset"===r,{xScale:h,yScale:d}=n._cachedMeta,l=n.resolveDataElementOptions(e,r),u=n.getSharedOptions(r,t[e],l);for(let l=e;l<e+i;l++){const e=!s&&n.getParsed(l),i=s?h.getBasePixel():h.getPixelForValue(e.x),u=s?d.getBasePixel():d.getPixelForValue(e.y),c=n.resolveDataElementOptions(l,r),{width:f,height:g,anchorX:p,anchorY:x}=c,y={x:o(p,i,f),y:a(x,u,g),width:f,height:g,options:c};n.updateElement(t[l],l,y,r)}n.updateSharedOptions(u,r)}draw(){const t=this,e=t.getMeta().data||[];let i,r;for(i=0,r=e.length;i<r;++i)e[i].draw(t._ctx)}}function o(t,e,i){return"left"===t||"start"===t?e:"right"===t||"end"===t?e-i:e-i/2}function a(t,e,i){return"top"===t||"start"===t?e:"bottom"===t||"end"===t?e-i:e-i/2}function s(t,e){const{x:i,y:r,width:n,height:o}=t.getProps(["x","y","width","height"],e);return{left:i,top:r,right:i+n,bottom:r+o}}function h(t,e,i){return Math.max(Math.min(t,i),e)}function d(t){const i=s(t),r=i.right-i.left,n=i.bottom-i.top,o=function(t,i,r){const n=t.options.borderWidth;let o,a,s,d;return e.isObject(n)?(o=+n.top||0,a=+n.right||0,s=+n.bottom||0,d=+n.left||0):o=a=s=d=+n||0,{t:h(o,0,r),r:h(a,0,i),b:h(s,0,r),l:h(d,0,i)}}(t,r/2,n/2);return{outer:{x:i.left,y:i.top,w:r,h:n},inner:{x:i.left+o.l,y:i.top+o.t,w:r-o.l-o.r,h:n-o.t-o.b}}}function l(t,e,i,r){const n=null===e,o=null===i,a=!(!t||n&&o)&&s(t,r);return a&&(n||e>=a.left&&e<=a.right)&&(o||i>=a.top&&i<=a.bottom)}n.id="matrix",n.version="1.2.0",n.defaults={dataElementType:"matrix",animations:{numbers:{type:"number",properties:["x","y","width","height"]}},anchorX:"center",anchorY:"center"},n.overrides={interaction:{mode:"nearest",intersect:!0},scales:{x:{type:"linear",offset:!0},y:{type:"linear",reverse:!0}}};class u extends t.Element{constructor(t){super(),this.options=void 0,this.width=void 0,this.height=void 0,t&&Object.assign(this,t)}draw(t){const i=this.options,{inner:r,outer:n}=d(this),o=e.toTRBLCorners(i.borderRadius);t.save(),n.w!==r.w||n.h!==r.h?(t.beginPath(),e.addRoundedRectPath(t,{x:n.x,y:n.y,w:n.w,h:n.h,radius:o}),e.addRoundedRectPath(t,{x:r.x,y:r.y,w:r.w,h:r.h,radius:o}),t.fillStyle=i.backgroundColor,t.fill(),t.fillStyle=i.borderColor,t.fill("evenodd")):(t.beginPath(),e.addRoundedRectPath(t,{x:r.x,y:r.y,w:r.w,h:r.h,radius:o}),t.fillStyle=i.backgroundColor,t.fill()),t.restore()}inRange(t,e,i){return l(this,t,e,i)}inXRange(t,e){return l(this,t,null,e)}inYRange(t,e){return l(this,null,t,e)}getCenterPoint(t){const{x:e,y:i,width:r,height:n}=this.getProps(["x","y","width","height"],t);return{x:e+r/2,y:i+n/2}}tooltipPosition(){return this.getCenterPoint()}getRange(t){return"x"===t?this.width/2:this.height/2}}u.id="matrix",u.defaults={backgroundColor:void 0,borderColor:void 0,borderWidth:void 0,borderRadius:0,anchorX:void 0,anchorY:void 0,width:20,height:20},r.default.register(n,u)}));
8
8
  //# sourceMappingURL=chartjs-chart-matrix.min.js.map
package/dist/chartjs-chart-matrix.min.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chartjs-chart-matrix.min.js","sources":["../src/controller.js","../src/element.js","../src/index.js"],"sourcesContent":["import {DatasetController} from 'chart.js';\nimport {version} from '../package.json';\n\nexport default class MatrixController extends DatasetController {\n initialize() {\n this.enableOptionSharing = true;\n super.initialize();\n }\n\n update(mode) {\n const me = this;\n const meta = me._cachedMeta;\n\n me.updateElements(meta.data, 0, meta.data.length, mode);\n }\n\n updateElements(rects, start, count, mode) {\n const me = this;\n const reset = mode === 'reset';\n const {xScale, yScale} = me._cachedMeta;\n const firstOpts = me.resolveDataElementOptions(start, mode);\n const sharedOptions = me.getSharedOptions(mode, rects[start], firstOpts);\n\n for (let i = start; i < start + count; i++) {\n const parsed = !reset && me.getParsed(i);\n const x = reset ? xScale.getBasePixel() : xScale.getPixelForValue(parsed.x);\n const y = reset ? yScale.getBasePixel() : yScale.getPixelForValue(parsed.y);\n const options = me.resolveDataElementOptions(i, mode);\n const {width, height, anchorX, anchorY} = options;\n const properties = {\n x: resolveX(anchorX, x, width),\n y: resolveY(anchorY, y, height),\n width,\n height,\n options\n };\n me.updateElement(rects[i], i, properties, mode);\n }\n\n me.updateSharedOptions(sharedOptions, mode);\n }\n\n draw() {\n const me = this;\n const data = me.getMeta().data || [];\n let i, ilen;\n\n for (i = 0, ilen = data.length; i < ilen; ++i) {\n data[i].draw(me._ctx);\n }\n }\n}\n\nfunction resolveX(anchorX, x, width) {\n if (anchorX === 'left' || anchorX === 'start') {\n return x;\n }\n if (anchorX === 'right' || anchorX === 'end') {\n return x - width;\n }\n return x - width / 2;\n}\n\nfunction resolveY(anchorY, y, height) {\n if (anchorY === 'top' || anchorY === 'start') {\n return y;\n }\n if (anchorY === 'bottom' || anchorY === 'end') {\n return y - height;\n }\n return y - height / 2;\n}\n\nMatrixController.id = 'matrix';\n\nMatrixController.version = version;\n\nMatrixController.defaults = {\n dataElementType: 'matrix',\n\n animations: {\n numbers: {\n type: 'number',\n properties: ['x', 'y', 'width', 'height']\n }\n },\n anchorX: 'center',\n anchorY: 'center'\n};\n\nMatrixController.overrides = {\n interaction: {\n mode: 'nearest',\n intersect: true\n },\n\n scales: {\n x: {\n type: 'linear',\n offset: true\n },\n y: {\n type: 'linear',\n reverse: true\n }\n },\n};\n","import {Element} from 'chart.js';\nimport {isObject, addRoundedRectPath, toTRBLCorners} from 'chart.js/helpers';\n\n/**\n * Helper function to get the bounds of the rect\n * @param {MatrixElement} rect the rect\n * @param {boolean} [useFinalPosition]\n * @return {object} bounds of the rect\n * @private\n */\nfunction getBounds(rect, useFinalPosition) {\n const {x, y, width, height} = rect.getProps(['x', 'y', 'width', 'height'], useFinalPosition);\n return {left: x, top: y, right: x + width, bottom: y + height};\n}\n\nfunction limit(value, min, max) {\n return Math.max(Math.min(value, max), min);\n}\n\nfunction parseBorderWidth(rect, maxW, maxH) {\n const value = rect.options.borderWidth;\n let t, r, b, l;\n\n if (isObject(value)) {\n t = +value.top || 0;\n r = +value.right || 0;\n b = +value.bottom || 0;\n l = +value.left || 0;\n } else {\n t = r = b = l = +value || 0;\n }\n\n return {\n t: limit(t, 0, maxH),\n r: limit(r, 0, maxW),\n b: limit(b, 0, maxH),\n l: limit(l, 0, maxW)\n };\n}\n\nfunction boundingRects(rect) {\n const bounds = getBounds(rect);\n const width = bounds.right - bounds.left;\n const height = bounds.bottom - bounds.top;\n const border = parseBorderWidth(rect, width / 2, height / 2);\n\n return {\n outer: {\n x: bounds.left,\n y: bounds.top,\n w: width,\n h: height\n },\n inner: {\n x: bounds.left + border.l,\n y: bounds.top + border.t,\n w: width - border.l - border.r,\n h: height - border.t - border.b\n }\n };\n}\n\nfunction inRange(rect, x, y, useFinalPosition) {\n const skipX = x === null;\n const skipY = y === null;\n const bounds = !rect || (skipX && skipY) ? false : getBounds(rect, useFinalPosition);\n\n return bounds\n\t\t&& (skipX || x >= bounds.left && x <= bounds.right)\n\t\t&& (skipY || y >= bounds.top && y <= bounds.bottom);\n}\n\nexport default class MatrixElement extends Element {\n constructor(cfg) {\n super();\n\n this.options = undefined;\n this.width = undefined;\n this.height = undefined;\n\n if (cfg) {\n Object.assign(this, cfg);\n }\n }\n\n draw(ctx) {\n const options = this.options;\n const {inner, outer} = boundingRects(this);\n const radius = toTRBLCorners(options.borderRadius);\n\n ctx.save();\n\n if (outer.w !== inner.w || outer.h !== inner.h) {\n ctx.beginPath();\n addRoundedRectPath(ctx, {x: outer.x, y: outer.y, w: outer.w, h: outer.h, radius});\n addRoundedRectPath(ctx, {x: inner.x, y: inner.y, w: inner.w, h: inner.h, radius});\n ctx.fillStyle = options.backgroundColor;\n ctx.fill();\n ctx.fillStyle = options.borderColor;\n ctx.fill('evenodd');\n } else {\n ctx.beginPath();\n addRoundedRectPath(ctx, {x: inner.x, y: inner.y, w: inner.w, h: inner.h, radius});\n ctx.fillStyle = options.backgroundColor;\n ctx.fill();\n }\n\n ctx.restore();\n }\n\n inRange(mouseX, mouseY, useFinalPosition) {\n return inRange(this, mouseX, mouseY, useFinalPosition);\n }\n\n inXRange(mouseX, useFinalPosition) {\n return inRange(this, mouseX, null, useFinalPosition);\n }\n\n inYRange(mouseY, useFinalPosition) {\n return inRange(this, null, mouseY, useFinalPosition);\n }\n\n getCenterPoint(useFinalPosition) {\n const {x, y, width, height} = this.getProps(['x', 'y', 'width', 'height'], useFinalPosition);\n return {\n x: x + width / 2,\n y: y + height / 2\n };\n }\n\n tooltipPosition() {\n return this.getCenterPoint();\n }\n\n getRange(axis) {\n return axis === 'x' ? this.width / 2 : this.height / 2;\n }\n}\n\nMatrixElement.id = 'matrix';\nMatrixElement.defaults = {\n backgroundColor: undefined,\n borderColor: undefined,\n borderWidth: undefined,\n borderRadius: 0,\n anchorX: undefined,\n anchorY: undefined,\n width: 20,\n height: 20\n};\n","import Chart from 'chart.js';\nimport MatrixController from './controller';\nimport MatrixElement from './element';\n\nChart.register(MatrixController, MatrixElement);\n"],"names":["MatrixController","DatasetController","initialize","this","enableOptionSharing","super","update","mode","meta","_cachedMeta","updateElements","data","length","rects","start","count","me","reset","xScale","yScale","firstOpts","resolveDataElementOptions","sharedOptions","getSharedOptions","i","parsed","getParsed","x","getBasePixel","getPixelForValue","y","options","width","height","anchorX","anchorY","properties","resolveX","resolveY","updateElement","updateSharedOptions","draw","getMeta","ilen","_ctx","getBounds","rect","useFinalPosition","getProps","left","top","right","bottom","limit","value","min","max","Math","boundingRects","bounds","border","maxW","maxH","borderWidth","t","r","b","l","isObject","parseBorderWidth","outer","w","h","inner","inRange","skipX","skipY","id","version","defaults","dataElementType","animations","numbers","type","overrides","interaction","intersect","scales","offset","reverse","MatrixElement","Element","constructor","cfg","undefined","Object","assign","ctx","radius","toTRBLCorners","borderRadius","save","beginPath","addRoundedRectPath","fillStyle","backgroundColor","fill","borderColor","restore","mouseX","mouseY","inXRange","inYRange","getCenterPoint","tooltipPosition","getRange","axis","Chart","register"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "chartjs-chart-matrix",
3
- "version": "1.1.0",
3
+ "version": "1.2.0",
4
4
  "description": "Chart.js module for creating matrix charts",
5
5
  "main": "dist/chartjs-chart-matrix.js",
6
6
  "module": "dist/chartjs-chart-matrix.esm.js",
@@ -29,7 +29,7 @@
29
29
  "matrix"
30
30
  ],
31
31
  "files": [
32
- "dist/*.js",
32
+ "dist/*",
33
33
  "types/index.esm.d.ts"
34
34
  ],
35
35
  "author": "Jukka Kurkela",
@@ -39,39 +39,39 @@
39
39
  },
40
40
  "homepage": "https://chartjs-chart-matrix.pages.dev/",
41
41
  "devDependencies": {
42
- "@rollup/plugin-commonjs": "^20.0.0",
42
+ "@rollup/plugin-commonjs": "^22.0.2",
43
43
  "@rollup/plugin-json": "^4.1.0",
44
- "@rollup/plugin-node-resolve": "^13.0.0",
45
- "@typescript-eslint/eslint-plugin": "^4.22.0",
46
- "@typescript-eslint/parser": "^4.22.0",
44
+ "@rollup/plugin-node-resolve": "^14.1.0",
45
+ "@typescript-eslint/eslint-plugin": "^5.6.0",
46
+ "@typescript-eslint/parser": "^5.6.0",
47
47
  "chart.js": "^3.0.0",
48
48
  "chartjs-adapter-date-fns": "^2.0.0",
49
- "chartjs-test-utils": "^0.3.0",
50
- "concurrently": "^6.0.0",
49
+ "chartjs-test-utils": "^0.4.0",
50
+ "concurrently": "^7.4.0",
51
51
  "cross-env": "^7.0.3",
52
52
  "date-fns": "^2.19.0",
53
- "eslint": "^7.22.0",
53
+ "eslint": "^8.4.1",
54
54
  "eslint-config-chartjs": "^0.3.0",
55
55
  "eslint-plugin-es": "^4.1.0",
56
- "eslint-plugin-html": "^6.1.2",
57
- "eslint-plugin-markdown": "^2.1.0",
58
- "jasmine-core": "^3.7.1",
56
+ "eslint-plugin-html": "^7.1.0",
57
+ "eslint-plugin-markdown": "^3.0.0",
58
+ "jasmine-core": "^4.4.0",
59
59
  "karma": "^6.2.0",
60
60
  "karma-chrome-launcher": "^3.1.0",
61
61
  "karma-coverage": "^2.0.3",
62
62
  "karma-firefox-launcher": "^2.1.0",
63
63
  "karma-jasmine": "^4.0.1",
64
64
  "karma-jasmine-html-reporter": "^1.5.4",
65
- "karma-rollup-preprocessor": "^7.0.7",
65
+ "karma-rollup-preprocessor": "7.0.7",
66
66
  "karma-spec-reporter": "0.0.32",
67
67
  "pixelmatch": "^5.2.1",
68
68
  "rollup": "^2.42.1",
69
69
  "rollup-plugin-analyzer": "^4.0.0",
70
70
  "rollup-plugin-istanbul": "^3.0.0",
71
71
  "rollup-plugin-terser": "^7.0.2",
72
- "typescript": "~4.3",
72
+ "typescript": "^4.5.2",
73
73
  "vuepress": "^1.8.2",
74
- "vuepress-plugin-flexsearch": "^0.2.0",
74
+ "vuepress-plugin-flexsearch": "^0.3.0",
75
75
  "vuepress-plugin-redirect": "^1.2.5",
76
76
  "vuepress-theme-chartjs": "^0.2.0"
77
77
  },
package/types/index.esm.d.ts CHANGED
@@ -33,7 +33,7 @@ declare module 'chart.js' {
33
33
  defaultDataPoint: MatrixDataPoint;
34
34
  parsedDataType: MatrixDataPoint;
35
35
  metaExtensions: AnyObject;
36
- scales: never;
36
+ scales: keyof CartesianScaleTypeRegistry;
37
37
  }
38
38
  }
39
39
  }