chartjs-chart-matrix 3.0.2 → 3.0.4

package/dist/chartjs-chart-matrix.cjs

@@ -0,0 +1,259 @@
+/*!
+ * chartjs-chart-matrix v0.0.0-development
+ * https://chartjs-chart-matrix.pages.dev/
+ * (c) 2026 Jukka Kurkela
+ * Released under the MIT license
+ */
+(function (global, factory) {
+typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('chart.js'), require('chart.js/helpers')) :
+typeof define === 'function' && define.amd ? define(['exports', 'chart.js', 'chart.js/helpers'], factory) :
+(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["chartjs-chart-matrix"] = {}, global.Chart, global.Chart.helpers));
+})(this, (function (exports, chart_js, helpers) { 'use strict';
+
+var version = "0.0.0-development";
+
+class MatrixController extends chart_js.DatasetController {
+    initialize() {
+        this.enableOptionSharing = true;
+        super.initialize();
+    }
+    update(mode) {
+        const meta = this._cachedMeta;
+        this.updateElements(meta.data, 0, meta.data.length, mode);
+    }
+    updateElements(rects, start, count, mode) {
+        const reset = mode === 'reset';
+        const { xScale, yScale } = this._cachedMeta;
+        const firstOpts = this.resolveDataElementOptions(start, mode);
+        const sharedOptions = this.getSharedOptions(firstOpts);
+        for(let i = start; i < start + count; i++){
+            const parsed = !reset && this.getParsed(i);
+            const x = reset ? xScale.getBasePixel() : xScale.getPixelForValue(parsed.x);
+            const y = reset ? yScale.getBasePixel() : yScale.getPixelForValue(parsed.y);
+            const options = this.resolveDataElementOptions(i, mode);
+            const { width, height, anchorX, anchorY } = options;
+            const properties = {
+                height,
+                options,
+                width,
+                x: resolveX(anchorX, x, width),
+                y: resolveY(anchorY, y, height)
+            };
+            this.updateElement(rects[i], i, properties, mode);
+        }
+        this.updateSharedOptions(sharedOptions, mode, firstOpts);
+    }
+    draw() {
+        const ctx = this.chart.ctx;
+        const data = this.getMeta().data || [];
+        let i, ilen;
+        for(i = 0, ilen = data.length; i < ilen; ++i){
+            data[i].draw(ctx);
+        }
+    }
+}
+MatrixController.id = 'matrix';
+MatrixController.version = version;
+MatrixController.defaults = {
+    animations: {
+        numbers: {
+            properties: [
+                'x',
+                'y',
+                'width',
+                'height'
+            ],
+            type: 'number'
+        }
+    },
+    dataElementType: 'matrix'
+};
+MatrixController.overrides = {
+    interaction: {
+        intersect: true,
+        mode: 'nearest'
+    },
+    scales: {
+        x: {
+            offset: true,
+            type: 'linear'
+        },
+        y: {
+            reverse: true,
+            type: 'linear'
+        }
+    }
+};
+function resolveX(anchorX, x, width) {
+    if (anchorX === 'left' || anchorX === 'start') {
+        return x;
+    }
+    if (anchorX === 'right' || anchorX === 'end') {
+        return x - width;
+    }
+    return x - width / 2;
+}
+function resolveY(anchorY, y, height) {
+    if (anchorY === 'top' || anchorY === 'start') {
+        return y;
+    }
+    if (anchorY === 'bottom' || anchorY === 'end') {
+        return y - height;
+    }
+    return y - height / 2;
+}
+
+function getBounds(element, useFinalPosition) {
+    const { x, y, width, height } = element.getProps([
+        'x',
+        'y',
+        'width',
+        'height'
+    ], useFinalPosition);
+    return {
+        bottom: y + height,
+        left: x,
+        right: x + width,
+        top: y
+    };
+}
+function limit(value, min, max) {
+    return Math.max(Math.min(value, max), min);
+}
+function parseBorderWidth(options, maxW, maxH) {
+    const value = options.borderWidth;
+    let t, r, b, l;
+    if (helpers.isObject(value)) {
+        t = +value.top || 0;
+        r = +value.right || 0;
+        b = +value.bottom || 0;
+        l = +value.left || 0;
+    } else {
+        t = r = b = l = +value || 0;
+    }
+    return {
+        b: limit(b, 0, maxH),
+        l: limit(l, 0, maxW),
+        r: limit(r, 0, maxW),
+        t: limit(t, 0, maxH)
+    };
+}
+function boundingRects(element) {
+    const bounds = getBounds(element, false);
+    const width = bounds.right - bounds.left;
+    const height = bounds.bottom - bounds.top;
+    const border = parseBorderWidth(element.options, width / 2, height / 2);
+    return {
+        inner: {
+            h: height - border.t - border.b,
+            w: width - border.l - border.r,
+            x: bounds.left + border.l,
+            y: bounds.top + border.t
+        },
+        outer: {
+            h: height,
+            w: width,
+            x: bounds.left,
+            y: bounds.top
+        }
+    };
+}
+function inRange(element, x, y, useFinalPosition) {
+    const skipX = x === null;
+    const skipY = y === null;
+    const bounds = !element || skipX && skipY ? false : getBounds(element, useFinalPosition);
+    return bounds && (skipX || x >= bounds.left && x <= bounds.right) && (skipY || y >= bounds.top && y <= bounds.bottom);
+}
+
+class MatrixElement extends chart_js.Element {
+    draw(ctx) {
+        const options = this.options;
+        const { inner, outer } = boundingRects(this);
+        const radius = helpers.toTRBLCorners(options.borderRadius);
+        ctx.save();
+        if (outer.w !== inner.w || outer.h !== inner.h) {
+            ctx.beginPath();
+            helpers.addRoundedRectPath(ctx, {
+                h: outer.h,
+                radius,
+                w: outer.w,
+                x: outer.x,
+                y: outer.y
+            });
+            helpers.addRoundedRectPath(ctx, {
+                h: inner.h,
+                radius,
+                w: inner.w,
+                x: inner.x,
+                y: inner.y
+            });
+            ctx.fillStyle = options.backgroundColor;
+            ctx.fill();
+            ctx.fillStyle = options.borderColor;
+            ctx.fill('evenodd');
+        } else {
+            ctx.beginPath();
+            helpers.addRoundedRectPath(ctx, {
+                h: inner.h,
+                radius,
+                w: inner.w,
+                x: inner.x,
+                y: inner.y
+            });
+            ctx.fillStyle = options.backgroundColor;
+            ctx.fill();
+        }
+        ctx.restore();
+    }
+    inRange(mouseX, mouseY, useFinalPosition) {
+        return inRange(this, mouseX, mouseY, useFinalPosition);
+    }
+    inXRange(mouseX, useFinalPosition) {
+        return inRange(this, mouseX, null, useFinalPosition);
+    }
+    inYRange(mouseY, useFinalPosition) {
+        return inRange(this, null, mouseY, useFinalPosition);
+    }
+    getCenterPoint(useFinalPosition) {
+        const { x, y, width, height } = this.getProps([
+            'x',
+            'y',
+            'width',
+            'height'
+        ], useFinalPosition);
+        return {
+            x: x + width / 2,
+            y: y + height / 2
+        };
+    }
+    tooltipPosition() {
+        return this.getCenterPoint();
+    }
+    getRange(axis) {
+        return axis === 'x' ? this.width / 2 : this.height / 2;
+    }
+    constructor(cfg){
+        super();
+        if (cfg) {
+            Object.assign(this, cfg);
+        }
+    }
+}
+MatrixElement.id = 'matrix';
+MatrixElement.defaults = {
+    anchorX: 'center',
+    anchorY: 'center',
+    backgroundColor: undefined,
+    borderColor: undefined,
+    borderRadius: 0,
+    borderWidth: undefined,
+    height: 20,
+    width: 20
+};
+
+chart_js.Chart.register(MatrixController, MatrixElement);
+
+exports.MatrixController = MatrixController;
+exports.MatrixElement = MatrixElement;
+
+}));

package/dist/chartjs-chart-matrix.esm.js

@@ -0,0 +1,251 @@
+/*!
+ * chartjs-chart-matrix v0.0.0-development
+ * https://chartjs-chart-matrix.pages.dev/
+ * (c) 2026 Jukka Kurkela
+ * Released under the MIT license
+ */
+import { DatasetController, Element } from 'chart.js';
+import { isObject, toTRBLCorners, addRoundedRectPath } from 'chart.js/helpers';
+
+var version = "0.0.0-development";
+
+class MatrixController extends DatasetController {
+    initialize() {
+        this.enableOptionSharing = true;
+        super.initialize();
+    }
+    update(mode) {
+        const meta = this._cachedMeta;
+        this.updateElements(meta.data, 0, meta.data.length, mode);
+    }
+    updateElements(rects, start, count, mode) {
+        const reset = mode === 'reset';
+        const { xScale, yScale } = this._cachedMeta;
+        const firstOpts = this.resolveDataElementOptions(start, mode);
+        const sharedOptions = this.getSharedOptions(firstOpts);
+        for(let i = start; i < start + count; i++){
+            const parsed = !reset && this.getParsed(i);
+            const x = reset ? xScale.getBasePixel() : xScale.getPixelForValue(parsed.x);
+            const y = reset ? yScale.getBasePixel() : yScale.getPixelForValue(parsed.y);
+            const options = this.resolveDataElementOptions(i, mode);
+            const { width, height, anchorX, anchorY } = options;
+            const properties = {
+                height,
+                options,
+                width,
+                x: resolveX(anchorX, x, width),
+                y: resolveY(anchorY, y, height)
+            };
+            this.updateElement(rects[i], i, properties, mode);
+        }
+        this.updateSharedOptions(sharedOptions, mode, firstOpts);
+    }
+    draw() {
+        const ctx = this.chart.ctx;
+        const data = this.getMeta().data || [];
+        let i, ilen;
+        for(i = 0, ilen = data.length; i < ilen; ++i){
+            data[i].draw(ctx);
+        }
+    }
+}
+MatrixController.id = 'matrix';
+MatrixController.version = version;
+MatrixController.defaults = {
+    animations: {
+        numbers: {
+            properties: [
+                'x',
+                'y',
+                'width',
+                'height'
+            ],
+            type: 'number'
+        }
+    },
+    dataElementType: 'matrix'
+};
+MatrixController.overrides = {
+    interaction: {
+        intersect: true,
+        mode: 'nearest'
+    },
+    scales: {
+        x: {
+            offset: true,
+            type: 'linear'
+        },
+        y: {
+            reverse: true,
+            type: 'linear'
+        }
+    }
+};
+function resolveX(anchorX, x, width) {
+    if (anchorX === 'left' || anchorX === 'start') {
+        return x;
+    }
+    if (anchorX === 'right' || anchorX === 'end') {
+        return x - width;
+    }
+    return x - width / 2;
+}
+function resolveY(anchorY, y, height) {
+    if (anchorY === 'top' || anchorY === 'start') {
+        return y;
+    }
+    if (anchorY === 'bottom' || anchorY === 'end') {
+        return y - height;
+    }
+    return y - height / 2;
+}
+
+function getBounds(element, useFinalPosition) {
+    const { x, y, width, height } = element.getProps([
+        'x',
+        'y',
+        'width',
+        'height'
+    ], useFinalPosition);
+    return {
+        bottom: y + height,
+        left: x,
+        right: x + width,
+        top: y
+    };
+}
+function limit(value, min, max) {
+    return Math.max(Math.min(value, max), min);
+}
+function parseBorderWidth(options, maxW, maxH) {
+    const value = options.borderWidth;
+    let t, r, b, l;
+    if (isObject(value)) {
+        t = +value.top || 0;
+        r = +value.right || 0;
+        b = +value.bottom || 0;
+        l = +value.left || 0;
+    } else {
+        t = r = b = l = +value || 0;
+    }
+    return {
+        b: limit(b, 0, maxH),
+        l: limit(l, 0, maxW),
+        r: limit(r, 0, maxW),
+        t: limit(t, 0, maxH)
+    };
+}
+function boundingRects(element) {
+    const bounds = getBounds(element, false);
+    const width = bounds.right - bounds.left;
+    const height = bounds.bottom - bounds.top;
+    const border = parseBorderWidth(element.options, width / 2, height / 2);
+    return {
+        inner: {
+            h: height - border.t - border.b,
+            w: width - border.l - border.r,
+            x: bounds.left + border.l,
+            y: bounds.top + border.t
+        },
+        outer: {
+            h: height,
+            w: width,
+            x: bounds.left,
+            y: bounds.top
+        }
+    };
+}
+function inRange(element, x, y, useFinalPosition) {
+    const skipX = x === null;
+    const skipY = y === null;
+    const bounds = !element || skipX && skipY ? false : getBounds(element, useFinalPosition);
+    return bounds && (skipX || x >= bounds.left && x <= bounds.right) && (skipY || y >= bounds.top && y <= bounds.bottom);
+}
+
+class MatrixElement extends Element {
+    draw(ctx) {
+        const options = this.options;
+        const { inner, outer } = boundingRects(this);
+        const radius = toTRBLCorners(options.borderRadius);
+        ctx.save();
+        if (outer.w !== inner.w || outer.h !== inner.h) {
+            ctx.beginPath();
+            addRoundedRectPath(ctx, {
+                h: outer.h,
+                radius,
+                w: outer.w,
+                x: outer.x,
+                y: outer.y
+            });
+            addRoundedRectPath(ctx, {
+                h: inner.h,
+                radius,
+                w: inner.w,
+                x: inner.x,
+                y: inner.y
+            });
+            ctx.fillStyle = options.backgroundColor;
+            ctx.fill();
+            ctx.fillStyle = options.borderColor;
+            ctx.fill('evenodd');
+        } else {
+            ctx.beginPath();
+            addRoundedRectPath(ctx, {
+                h: inner.h,
+                radius,
+                w: inner.w,
+                x: inner.x,
+                y: inner.y
+            });
+            ctx.fillStyle = options.backgroundColor;
+            ctx.fill();
+        }
+        ctx.restore();
+    }
+    inRange(mouseX, mouseY, useFinalPosition) {
+        return inRange(this, mouseX, mouseY, useFinalPosition);
+    }
+    inXRange(mouseX, useFinalPosition) {
+        return inRange(this, mouseX, null, useFinalPosition);
+    }
+    inYRange(mouseY, useFinalPosition) {
+        return inRange(this, null, mouseY, useFinalPosition);
+    }
+    getCenterPoint(useFinalPosition) {
+        const { x, y, width, height } = this.getProps([
+            'x',
+            'y',
+            'width',
+            'height'
+        ], useFinalPosition);
+        return {
+            x: x + width / 2,
+            y: y + height / 2
+        };
+    }
+    tooltipPosition() {
+        return this.getCenterPoint();
+    }
+    getRange(axis) {
+        return axis === 'x' ? this.width / 2 : this.height / 2;
+    }
+    constructor(cfg){
+        super();
+        if (cfg) {
+            Object.assign(this, cfg);
+        }
+    }
+}
+MatrixElement.id = 'matrix';
+MatrixElement.defaults = {
+    anchorX: 'center',
+    anchorY: 'center',
+    backgroundColor: undefined,
+    borderColor: undefined,
+    borderRadius: 0,
+    borderWidth: undefined,
+    height: 20,
+    width: 20
+};
+
+export { MatrixController, MatrixElement };

package/dist/chartjs-chart-matrix.min.js

@@ -0,0 +1,8 @@
+/*!
+ * chartjs-chart-matrix v0.0.0-development
+ * https://chartjs-chart-matrix.pages.dev/
+ * (c) 2026 Jukka Kurkela
+ * Released under the MIT license
+ */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("chart.js"),require("chart.js/helpers")):"function"==typeof define&&define.amd?define(["exports","chart.js","chart.js/helpers"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self)["chartjs-chart-matrix"]={},t.Chart,t.Chart.helpers)}(this,function(t,e,r){"use strict";class i extends e.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,r,i){const s="reset"===i,{xScale:a,yScale:h}=this._cachedMeta,l=this.resolveDataElementOptions(e,i),d=this.getSharedOptions(l);for(let l=e;l<e+r;l++){const e=!s&&this.getParsed(l),r=s?a.getBasePixel():a.getPixelForValue(e.x),d=s?h.getBasePixel():h.getPixelForValue(e.y),u=this.resolveDataElementOptions(l,i),{width:c,height:g,anchorX:p,anchorY:f}=u,x={height:g,options:u,width:c,x:n(p,r,c),y:o(f,d,g)};this.updateElement(t[l],l,x,i)}this.updateSharedOptions(d,i,l)}draw(){const t=this.chart.ctx,e=this.getMeta().data||[];let r,i;for(r=0,i=e.length;r<i;++r)e[r].draw(t)}}function n(t,e,r){return"left"===t||"start"===t?e:"right"===t||"end"===t?e-r:e-r/2}function o(t,e,r){return"top"===t||"start"===t?e:"bottom"===t||"end"===t?e-r:e-r/2}function s(t,e){const{x:r,y:i,width:n,height:o}=t.getProps(["x","y","width","height"],e);return{bottom:i+o,left:r,right:r+n,top:i}}function a(t,e,r){return Math.max(Math.min(t,r),e)}function h(t){const e=s(t,!1),i=e.right-e.left,n=e.bottom-e.top,o=function(t,e,i){const n=t.borderWidth;let o,s,h,l;return r.isObject(n)?(o=+n.top||0,s=+n.right||0,h=+n.bottom||0,l=+n.left||0):o=s=h=l=+n||0,{b:a(h,0,i),l:a(l,0,e),r:a(s,0,e),t:a(o,0,i)}}(t.options,i/2,n/2);return{inner:{h:n-o.t-o.b,w:i-o.l-o.r,x:e.left+o.l,y:e.top+o.t},outer:{h:n,w:i,x:e.left,y:e.top}}}function l(t,e,r,i){const n=null===e,o=null===r,a=!(!t||n&&o)&&s(t,i);return a&&(n||e>=a.left&&e<=a.right)&&(o||r>=a.top&&r<=a.bottom)}i.id="matrix",i.version="0.0.0-development",i.defaults={animations:{numbers:{properties:["x","y","width","height"],type:"number"}},dataElementType:"matrix"},i.overrides={interaction:{intersect:!0,mode:"nearest"},scales:{x:{offset:!0,type:"linear"},y:{reverse:!0,type:"linear"}}};class d extends e.Element{draw(t){const e=this.options,{inner:i,outer:n}=h(this),o=r.toTRBLCorners(e.borderRadius);t.save(),n.w!==i.w||n.h!==i.h?(t.beginPath(),r.addRoundedRectPath(t,{h:n.h,radius:o,w:n.w,x:n.x,y:n.y}),r.addRoundedRectPath(t,{h:i.h,radius:o,w:i.w,x:i.x,y:i.y}),t.fillStyle=e.backgroundColor,t.fill(),t.fillStyle=e.borderColor,t.fill("evenodd")):(t.beginPath(),r.addRoundedRectPath(t,{h:i.h,radius:o,w:i.w,x:i.x,y:i.y}),t.fillStyle=e.backgroundColor,t.fill()),t.restore()}inRange(t,e,r){return l(this,t,e,r)}inXRange(t,e){return l(this,t,null,e)}inYRange(t,e){return l(this,null,t,e)}getCenterPoint(t){const{x:e,y:r,width:i,height:n}=this.getProps(["x","y","width","height"],t);return{x:e+i/2,y:r+n/2}}tooltipPosition(){return this.getCenterPoint()}getRange(t){return"x"===t?this.width/2:this.height/2}constructor(t){super(),t&&Object.assign(this,t)}}d.id="matrix",d.defaults={anchorX:"center",anchorY:"center",backgroundColor:void 0,borderColor:void 0,borderRadius:0,borderWidth:void 0,height:20,width:20},e.Chart.register(i,d),t.MatrixController=i,t.MatrixElement=d});
+//# sourceMappingURL=chartjs-chart-matrix.min.js.map

package/dist/chartjs-chart-matrix.min.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chartjs-chart-matrix.min.js","sources":["../src/controller.ts","../src/helpers.ts","../src/element.ts","../src/index.ts"],"sourcesContent":["import type { UpdateMode } from 'chart.js'\nimport type {\n  AnchorX,\n  AnchorY,\n  MatrixControllerDatasetOptions,\n  MatrixParsedDataPoint,\n} from 'types/index.esm'\nimport type MatrixElement from './element'\n\nimport { DatasetController } from 'chart.js'\n\nimport { version } from '../package.json'\n\nexport default class MatrixController extends DatasetController<\n  'matrix',\n  MatrixElement,\n  MatrixElement,\n  MatrixParsedDataPoint\n> {\n  static readonly id = 'matrix'\n  static readonly version = version\n\n  static readonly defaults = {\n    animations: {\n      numbers: {\n        properties: ['x', 'y', 'width', 'height'],\n        type: 'number',\n      },\n    },\n    dataElementType: 'matrix',\n  }\n\n  static readonly overrides = {\n    interaction: {\n      intersect: true,\n      mode: 'nearest',\n    },\n    scales: {\n      x: {\n        offset: true,\n        type: 'linear',\n      },\n      y: {\n        reverse: true,\n        type: 'linear',\n      },\n    },\n  }\n\n  options: MatrixControllerDatasetOptions\n\n  override initialize() {\n    this.enableOptionSharing = true\n    super.initialize()\n  }\n\n  override update(mode: UpdateMode) {\n    const meta = this._cachedMeta\n\n    this.updateElements(meta.data, 0, meta.data.length, mode)\n  }\n\n  override updateElements(rects: MatrixElement[], start: number, count: number, mode: UpdateMode) {\n    const reset = mode === 'reset'\n    const { xScale, yScale } = this._cachedMeta\n    const firstOpts = this.resolveDataElementOptions(start, mode)\n    const sharedOptions = this.getSharedOptions(firstOpts)\n\n    for (let i = start; i < start + count; i++) {\n      const parsed = !reset && this.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 = this.resolveDataElementOptions(i, mode)\n      const { width, height, anchorX, anchorY } = options\n      const properties = {\n        height,\n        options,\n        width,\n        x: resolveX(anchorX, x, width),\n        y: resolveY(anchorY, y, height),\n      }\n      this.updateElement(rects[i], i, properties, mode)\n    }\n\n    this.updateSharedOptions(sharedOptions, mode, firstOpts)\n  }\n\n  override draw() {\n    const ctx = this.chart.ctx\n    const data = this.getMeta().data || []\n    let i: number, ilen: number\n\n    for (i = 0, ilen = data.length; i < ilen; ++i) {\n      data[i].draw(ctx)\n    }\n  }\n}\n\nfunction resolveX(anchorX: AnchorX, x: number, width: number) {\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: AnchorY, y: number, height: number) {\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","import type { MatrixOptions } from 'types/index.esm'\nimport type MatrixElement from './element'\n\nimport { isObject } from 'chart.js/helpers'\n\ntype Bounds = { left: number; top: number; right: number; bottom: number }\n\nfunction getBounds(element: MatrixElement, useFinalPosition: boolean): Bounds {\n  const { x, y, width, height } = element.getProps(['x', 'y', 'width', 'height'], useFinalPosition)\n  return { bottom: y + height, left: x, right: x + width, top: y }\n}\n\nfunction limit(value: number, min: number, max: number) {\n  return Math.max(Math.min(value, max), min)\n}\n\nexport function parseBorderWidth(\n  options: Pick<MatrixOptions, 'borderWidth'>,\n  maxW: number,\n  maxH: number\n) {\n  const value = options.borderWidth\n  let t: number, r: number, b: number, l: number\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    b: limit(b, 0, maxH),\n    l: limit(l, 0, maxW),\n    r: limit(r, 0, maxW),\n    t: limit(t, 0, maxH),\n  }\n}\n\nexport function boundingRects(element: MatrixElement) {\n  const bounds = getBounds(element, false)\n  const width = bounds.right - bounds.left\n  const height = bounds.bottom - bounds.top\n  const border = parseBorderWidth(element.options, width / 2, height / 2)\n\n  return {\n    inner: {\n      h: height - border.t - border.b,\n      w: width - border.l - border.r,\n      x: bounds.left + border.l,\n      y: bounds.top + border.t,\n    },\n    outer: {\n      h: height,\n      w: width,\n      x: bounds.left,\n      y: bounds.top,\n    },\n  }\n}\n\nexport function inRange(element: MatrixElement, x: number, y: number, useFinalPosition: boolean) {\n  const skipX = x === null\n  const skipY = y === null\n  const bounds = !element || (skipX && skipY) ? false : getBounds(element, useFinalPosition)\n\n  return (\n    bounds &&\n    (skipX || (x >= bounds.left && x <= bounds.right)) &&\n    (skipY || (y >= bounds.top && y <= bounds.bottom))\n  )\n}\n","import type { MatrixOptions, MatrixProps } from 'types/index.esm'\n\nimport { Element } from 'chart.js'\nimport { addRoundedRectPath, toTRBLCorners } from 'chart.js/helpers'\n\nimport { boundingRects, inRange } from './helpers'\n\nexport default class MatrixElement extends Element<MatrixProps, MatrixOptions> {\n  static readonly id = 'matrix'\n\n  static override readonly defaults = {\n    anchorX: 'center',\n    anchorY: 'center',\n    backgroundColor: undefined,\n    borderColor: undefined,\n    borderRadius: 0,\n    borderWidth: undefined,\n    height: 20,\n    width: 20,\n  }\n\n  width: number\n  height: number\n\n  constructor(cfg: MatrixProps) {\n    super()\n\n    if (cfg) {\n      Object.assign(this, cfg)\n    }\n  }\n\n  draw(ctx: CanvasRenderingContext2D) {\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, { h: outer.h, radius, w: outer.w, x: outer.x, y: outer.y })\n      addRoundedRectPath(ctx, { h: inner.h, radius, w: inner.w, x: inner.x, y: inner.y })\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, { h: inner.h, radius, w: inner.w, x: inner.x, y: inner.y })\n      ctx.fillStyle = options.backgroundColor\n      ctx.fill()\n    }\n\n    ctx.restore()\n  }\n\n  inRange(mouseX: number, mouseY: number, useFinalPosition?: boolean) {\n    return inRange(this, mouseX, mouseY, useFinalPosition)\n  }\n\n  inXRange(mouseX: number, useFinalPosition?: boolean) {\n    return inRange(this, mouseX, null, useFinalPosition)\n  }\n\n  inYRange(mouseY: number, useFinalPosition?: boolean) {\n    return inRange(this, null, mouseY, useFinalPosition)\n  }\n\n  getCenterPoint(useFinalPosition?: boolean) {\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  override tooltipPosition() {\n    return this.getCenterPoint()\n  }\n\n  getRange(axis: 'x' | 'y') {\n    return axis === 'x' ? this.width / 2 : this.height / 2\n  }\n}\n","import { Chart } from 'chart.js'\n\nimport MatrixController from './controller.js'\nimport MatrixElement from './element.js'\n\nChart.register(MatrixController, MatrixElement)\n\nexport { MatrixController, MatrixElement }\n"],"names":["MatrixController","DatasetController","initialize","this","enableOptionSharing","super","update","mode","meta","_cachedMeta","updateElements","data","length","rects","start","count","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","ctx","chart","getMeta","ilen","getBounds","element","useFinalPosition","getProps","bottom","left","right","top","limit","value","min","max","Math","boundingRects","bounds","border","maxW","maxH","borderWidth","t","r","b","l","isObject","parseBorderWidth","inner","h","w","outer","inRange","skipX","skipY","id","version","defaults","animations","numbers","type","dataElementType","overrides","interaction","intersect","scales","offset","reverse","MatrixElement","Element","radius","toTRBLCorners","borderRadius","save","beginPath","addRoundedRectPath","fillStyle","backgroundColor","fill","borderColor","restore","mouseX","mouseY","inXRange","inYRange","getCenterPoint","tooltipPosition","getRange","axis","constructor","cfg","Object","assign","undefined","Chart","register"],"mappings":"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"}

package/package.json

@@ -102,5 +102,5 @@
   "type": "module",
   "types": "types/index.esm.d.ts",
   "unpkg": "dist/chartjs-chart-matrix.min.js",
-  "version": "3.0.2"
+  "version": "3.0.4"
 }

package/types/index.esm.d.ts

@@ -1,4 +1,4 @@
-import {
+import type {
   BorderRadius,
   CartesianScaleTypeRegistry,
   Chart,
@@ -32,6 +32,12 @@ export interface MatrixControllerDatasetOptions
     ScriptableAndArrayOptions<CommonHoverOptions, ScriptableContext<'matrix'>> {}
 
 export interface MatrixDataPoint {
+  x: number | string
+  y: number | string
+  v?: number
+}
+
+export interface MatrixParsedDataPoint {
   x: number
   y: number
 }
@@ -42,7 +48,7 @@ declare module 'chart.js' {
       chartOptions: CoreChartOptions<'matrix'>
       datasetOptions: MatrixControllerDatasetOptions
       defaultDataPoint: MatrixDataPoint
-      parsedDataType: MatrixDataPoint
+      parsedDataType: MatrixParsedDataPoint
       metaExtensions: AnyObject
       scales: keyof CartesianScaleTypeRegistry
     }
@@ -58,7 +64,7 @@ export interface MatrixProps {
 }
 
 export type MatrixController = DatasetController
-export const MatrixController: ChartComponent & {
+export declare const MatrixController: ChartComponent & {
   prototype: MatrixController
   new (chart: Chart, datasetIndex: number): MatrixController
 }
@@ -69,7 +75,7 @@ export interface MatrixElement<
 > extends Element<T, O>,
     VisualElement {}
 
-export const MatrixElement: ChartComponent & {
+export declare const MatrixElement: ChartComponent & {
   prototype: MatrixElement
   new (cfg: AnyObject): MatrixElement
 }