Package Exports

chartjs-plugin-fill-gaps-zero
chartjs-plugin-fill-gaps-zero/src/chartjs-plugin-fill-gaps-zero.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (chartjs-plugin-fill-gaps-zero) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

chartjs-plugin-fill-gaps-zero

This plugin fill gaps with zero in X time axis for line Chart. Made for Chart.js 3.X

Demo

Installation

Load directly in the browser

Load ChartJS first, then the plugin which will automatically register itself with ChartJS

<script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/giaroc/chartjs-plugin-fill-gaps-zero/src/chartjs-plugin-fill-gaps-zero.min.js"></script>

Download

Compress
Uncompress

NPM

You can also install chartjs-plugin-fill-gaps-zero by using node.js.

npm install chartjs-plugin-fill-gaps-zero

Configuration

To configure the fill-gaps-ze ro plugin you need the following options in the X axis namespace: options.scales.x

Name	Type	Description
`fillGapsWithZero`	`boolean`	If true enable the functionality to fill gaps with zero
`minUnit`	`string`	Definition of the unit (eg. `day`) to be marked as zero

Example

{
  type: 'line',
  data: {
    labels: [],
    datasets: []
  },
  options: {
    scales: {
      x: {
        fillGapsWithZero: true,
        minUnit: 'day',
        type: 'time',
        time: {
          unit: 'day'
        },
        grid: {
          display: false
        }
      },
      y: {
        grid: {
          display: false
        }
      }
    },
    elements: {
      line: {
        tension: .3
      }
    }
  }
}

Supported chart types

line

Contributing

Pull requests and issues are always welcome. For bugs and feature requests, please create an issue.

License

chartjs-plugin-fill-gaps-zero.js is available under the MIT license.