Package Exports

@01coder/chartjs-plugin-selectdrag
@01coder/chartjs-plugin-selectdrag/lib/index.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 (@01coder/chartjs-plugin-selectdrag) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Chart JS Plugin Select Drag

Chartjs plugin which allows you to select a range of data by dragging over a chart, see example https://stackblitz.com/edit/chartjs-selectdrag?file=index.html

Usage

import Chart from "chart.js/auto";
import SelectDragPlugin from "@01coder/chartjs-plugin-selectdrag";
Chart.register(SelectDragPlugin);

Enable it in the settings of a chart

type: "bar",
options: {
  plugins: {
      selectdrag: {
          enabled: true,
          onSelectComplete: (event) => {
              // Show selected
              document.getElementById('results').innerHTML = event.range;

              // Get selected range
              console.log(event.range);
              
              // Get selection coordinates
              console.log(event.boundingBox);
          }
      }
  },
},
data: { 
    labels: [], 
    datasets: []
}

Please note: This package is yet to be fully reviewed and tested, furthermore changes need to be made for other charts and selection types...