Nicely Presented Misnomer

    chartjs-chart-matrix
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.1 • Public • Published

    chartjs-chart-matrix

    Chart.js v3.0.0 module for creating matrix charts

    npm release npm bundle size GitHub Quality Gate Status documentation

    Documentation

    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'

    const chart = new Chart(ctx, {
      type: 'matrix',
      data: dataObject
    });

    Configuration

    Matrix chart allows configuration of width and height of the data points in addition to standard Chart.js configuration.

    const chart = new Chart(ctx, {
      type: 'matrix',
      data: {
        datasets: [{
          label: 'My Matrix',
          data: [
            {x: 1, y: 1, v: 11},
            {x: 2, y: 2, v: 22},
            {x: 3, y: 3, v: 33}
          ],
          backgroundColor: function(ctx) {
            var value = ctx.dataset.data[ctx.dataIndex].v;
            var alpha = (value - 5) / 40;
            return Color('green').alpha(alpha).rgbString();
          },
          width: function(ctx) {
            var a = ctx.chart.chartArea;
            return (a.right - a.left) / 3.5;
          },
          height: function(ctx) {
            var a = ctx.chart.chartArea;
            return (a.bottom - a.top) / 3.5;
          }
        }]
      },
    });

    Example

    Matrix Example Image

    Development

    You first need to install node dependencies (requires Node.js):

    > npm install

    The following commands will then be available from the repository root:

    > npm run build        // build dist files
    > npm test             // run all tests
    > npm run lint         // perform code linting
    > npm package          // create an archive with dist files and samples

    License

    chartjs-chart-matrix is available under the MIT license.

    Dependencies (0)

      Dev Dependencies (35)

      Install

      npm i chartjs-chart-matrix

      DownloadsWeekly Downloads

      4,343

      Version

      1.1.1

      License

      MIT

      Unpacked Size

      24.9 kB

      Total Files

      7

      Last publish

      Collaborators

      • kurkle