Skip to content

634750802/chartjs-plugin-roughness

Repository files navigation

chartjs-plugin-roughness

demo

Usage

h5

import 'chartjs-plugin-roughness'

new Chart(..., {
  ...,
  plugins: {
    roughness: {
      disabled: true // enable by default if imported chartjs-plugin-roughness
      // more rough options
    }
  }
})

SSR

@napi-rs/canvas is supported for SSR, see demo.

Rough Options

See rough options for more options.

Caution

  • This package should be imported before chart.js.
  • This package override BarElement.draw method if roughness was enabled.
  • This package override Filler hooks for clearing stroke colors to prevent area border.
  • This package override beginPath, closePath, fill, stroke, moveTo, lineTo, arcTo, arc, quadraticCurveTo, rect, ellipse, bezierCurveTo while roughness chart rendering. ellipse was not implemented by roughjs, you should provide your own polyfill if you want this feature.
  • This package override window.Path2D class and should act same as original.
  • This package override TooltupPlugin class to skip drawing tooltip background using roughness. Set tooltip plugin option preventSkipBackgroundRoughness to true to prevent it.