Catalog npm
Back to packageRELEASE DETAILS

1.0.0

npm

@01coder/chartjs-plugin-selectdrag

Chartjs plugin which allows you to select a range of data by dragging over a chart

brushchartjsdragrangeselect
Published8 Sept 2022
Direct dependencies1
Transitive dependenciesNot calculated

README

Current package documentation

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

Register the plugin with chart js...

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,
            output: 'value', // Can be 'value' or 'label'
            highlight: false, // Highlight the selected data on the chart?
            colors: {
                selection: "#e8eff6", // Background color of selection box
                selected: "#1f77b4", // Color of selected data
                unselected: "#cccccc" // Color of unselected data
            },
            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: []
}

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 1

Native requirements
1 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
typescript
Environment
{
  "local_name": "typescript",
  "alias": false,
  "peer_metadata": null
}
^4.8.2development

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "shasum": "9ddc9c4fdc903824930cf419394e9549db655524",
  "tarball": "https://registry.npmjs.org/@01coder/chartjs-plugin-selectdrag/-/chartjs-plugin-selectdrag-1.0.0.tgz",
  "fileCount": 4,
  "integrity": "sha512-vicjMc1SkcSZ7MHVLEKXiI83MZxHXdg7Ym/e1C86gLwE0sgquuh+xAgNUCr/rOw2n0y9teilydapPB2rM9eWzQ==",
  "signatures": [
    {
      "sig": "MEYCIQDrv0wWnI0LzieSY1YFQJok4H2v0nRtGQjMnkNa+Xrf5gIhAIQvs2C5zIWTe584MygCl5JlDKTd+kH88Kipinoj8z80",
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"
    }
  ],
  "unpackedSize": 9932,
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjGbZgACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmppTA/+JTOhV43l9/+ONdKcIkAHOcXIOSnPaO70SERgqS1UeoFwZX7R\r\nGcpCLIWg+DVHBUg5Vb36BD+j1qc0AHZ3zyDzWGry/vlGMMhuZFh6eVCJvEcK\r\n012R8Ls1spKaf6hkkF8At0IjKG66t0HdyIZ+EZXkiI8nKdr1jVvQb+mts/cO\r\nIM9hps2IADD6uLrR7sRJrWBMhgXY2VmLnER5lBjJhKnw/eCLd+i7YXLL0UxA\r\nujm0vdfb+Z8klMKcvbhxaWjq0r6/8/3FYN5/TyOYywMNCXqALaZXGgf8TUuF\r\ngdORZJAAVyRIaZTx3Vw4FRCoQn9hCR5e+Ex2HQvYUpRoKq987okhsNAMwpUr\r\nyrcUTMGx2075JMIWBzUPJO3ntgJ5+6qDSfi1BpNu93qWbjPPiYAmrH3sBuoz\r\nJFTr88/WR7X01P2RPJeMQ/lRvVw7EjUq+yYVoM0WdtxzrAh2lJ6Nj7+UrJHk\r\nenAfG3qfSS1SfBhIZAs42TerF5HK/jnMxckkldTq44oZpipyg7O1B2oBnuY1\r\nnOMLdKmf24vPPJ3M/SamAfZKXZrWcyKfZ5l6XV+dvzL6ZRRaKXMXEgSHCbaI\r\n6ZkqxQQR3cD8sU90b0SfreSHdQ3/efbWfdKaaN8GLfGi2LjPEvSjnS7itAr+\r\nquNQJKOtijIpFzmAKSXywbOoqhngeZpM/OQ=\r\n=4fgU\r\n-----END PGP SIGNATURE-----\r\n"
}

Repository

PENDING
01codelt/chartjs-plugin-selectdrag

Shared repository data · GitHub

License detected in repository
Not collected

Metadata history

Meaningful changes
Current collected state Current

Observed since 20 Oct, 21:56 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:2cef70263d2dfa0d995ff6c63b089df2eb243e9e3e1f3d0ec7caf558d05c30ba

Other collected versions

2.0.426 Aug2.0.32 Feb2.0.218 Nov2.0.113 May2.0.016 Apr1.0.431 MarView all collected versions →