New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More

chartjs-plugin-doughnutlabel-rebourne

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

chartjs-plugin-doughnutlabel-rebourne - npm Package Compare versions

Comparing version 3.0.0-beta.3 to 3.0.0-beta.4

@@ -66,2 +66,8 @@ (function (global, factory) {

const strOnly = new RegExp('^[0-9]+$');
if (!strOnly.test(font.size) && typeof font.size !== 'number') {
throw 'Invalid font size value! Only pixels allowed!';
}
return (

@@ -162,5 +168,3 @@ (font.style ? font.style + ' ' : '') +

innerLabel.font.lineHeight = undefined;
innerLabel.font = utils.parseFont(
helpers.resolve([innerLabel.font, defaults.font], ctx, 0)
);
innerLabel.font = utils.parseFont(innerLabel.font);
});

@@ -167,0 +171,0 @@

@@ -1,1 +0,1 @@

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("chart.js/helpers"),require("chart.js")):"function"==typeof define&&define.amd?define(["chart.js/helpers","chart.js"],e):t.DoughnutLabel=e(t.Chart.helpers,t.Chart)}(this,function(p,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;var v={font:{family:void 0,lineHeight:1.2,size:void 0,style:void 0,weight:null},paddingPercentage:10,display:!0,api:"beforeDatasetDraw",color:"#000000"},y={parseFont:function(t){var e=n.defaults,i=p.valueOrDefault(t.size,e.font.size),t={family:p.valueOrDefault(t.family,e.font.family),lineHeight:p.toLineHeight(t.lineHeight,i),size:i,style:p.valueOrDefault(t.style,e.font.style),weight:p.valueOrDefault(t.weight,null),string:""};return t.string=y.toFontString(t),t},toFontString:function(t){return!t||p.isNullOrUndef(t.size)||p.isNullOrUndef(t.family)?null:(t.style?t.style+" ":"")+(t.weight?t.weight+" ":"")+t.size+"px "+t.family},textSize:function(t,e){for(var i=[].concat(e),n=i.length,e=t.font,o=0,r=0,l=0;l<n;++l)t.font=i[l].font.string,o=Math.max(t.measureText(i[l].text).width,o),r+=i[l].font.lineHeight;return t.font=e,{height:r,width:o}}};return{id:"doughnutlabel",beforeInit:function(t,e,i){t=t.ctx;this[p.resolve([i.api,v.api],t,0)]=this._drawLabels},_drawLabels:function(i,t,n){if(n&&n.labels&&0<n.labels.length){var o=i.ctx,r=[];n.labels.forEach(t=>{var e;e=t,p.resolve([e.display,n.display,v.display],o,0)&&(t={text:"function"==typeof t.text?t.text(i):t.text,font:y.parseFont(p.resolve([t.font,n.font,v.font],o,0)),color:p.resolve([t.color,n.color,v.color],o,0)},r.push(t))});var e=y.textSize(o,r),l=1-p.resolve([n.paddingPercentage,v.paddingPercentage],o,0)/100,a=Math.sqrt(Math.pow(e.width,2)+Math.pow(e.height,2)),f=2*t.meta.controller.innerRadius/a*l;f<1&&(r.forEach(function(t){t.font.size=Math.floor(t.font.size*f),t.font.lineHeight=void 0,t.font=y.parseFont(p.resolve([t.font,v.font],o,0))}),e=y.textSize(o,r)),o.textAlign="center",o.textBaseline="middle";for(var s=(i.chartArea.left+i.chartArea.right)/2,h=(i.chartArea.top+i.chartArea.bottom)/2-e.height/2,u=r.length,c=0,d=0;d<u;++d){o.fillStyle=r[d].color,o.font=r[d].font.string;var g=h+r[d].font.lineHeight/2+c;c+=r[d].font.lineHeight,o.fillText(r[d].text,s,g)}}}}});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("chart.js/helpers"),require("chart.js")):"function"==typeof define&&define.amd?define(["chart.js/helpers","chart.js"],t):e.DoughnutLabel=t(e.Chart.helpers,e.Chart)}(this,function(p,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;var y={font:{family:void 0,lineHeight:1.2,size:void 0,style:void 0,weight:null},paddingPercentage:10,display:!0,api:"beforeDatasetDraw",color:"#000000"},v={parseFont:function(e){var t=n.defaults,i=p.valueOrDefault(e.size,t.font.size),e={family:p.valueOrDefault(e.family,t.font.family),lineHeight:p.toLineHeight(e.lineHeight,i),size:i,style:p.valueOrDefault(e.style,t.font.style),weight:p.valueOrDefault(e.weight,null),string:""};return e.string=v.toFontString(e),e},toFontString:function(e){if(!e||p.isNullOrUndef(e.size)||p.isNullOrUndef(e.family))return null;const t=new RegExp("^[0-9]+$");if(!t.test(e.size)&&"number"!=typeof e.size)throw"Invalid font size value! Only pixels allowed!";return(e.style?e.style+" ":"")+(e.weight?e.weight+" ":"")+e.size+"px "+e.family},textSize:function(e,t){for(var i=[].concat(t),n=i.length,t=e.font,o=0,l=0,r=0;r<n;++r)e.font=i[r].font.string,o=Math.max(e.measureText(i[r].text).width,o),l+=i[r].font.lineHeight;return e.font=t,{height:l,width:o}}};return{id:"doughnutlabel",beforeInit:function(e,t,i){e=e.ctx;this[p.resolve([i.api,y.api],e,0)]=this._drawLabels},_drawLabels:function(i,e,n){if(n&&n.labels&&0<n.labels.length){var o=i.ctx,l=[];n.labels.forEach(e=>{var t;t=e,p.resolve([t.display,n.display,y.display],o,0)&&(e={text:"function"==typeof e.text?e.text(i):e.text,font:v.parseFont(p.resolve([e.font,n.font,y.font],o,0)),color:p.resolve([e.color,n.color,y.color],o,0)},l.push(e))});var t=v.textSize(o,l),r=1-p.resolve([n.paddingPercentage,y.paddingPercentage],o,0)/100,a=Math.sqrt(Math.pow(t.width,2)+Math.pow(t.height,2)),f=2*e.meta.controller.innerRadius/a*r;f<1&&(l.forEach(function(e){e.font.size=Math.floor(e.font.size*f),e.font.lineHeight=void 0,e.font=v.parseFont(e.font)}),t=v.textSize(o,l)),o.textAlign="center",o.textBaseline="middle";for(var s=(i.chartArea.left+i.chartArea.right)/2,h=(i.chartArea.top+i.chartArea.bottom)/2-t.height/2,u=l.length,d=0,c=0;c<u;++c){o.fillStyle=l[c].color,o.font=l[c].font.string;var g=h+l[c].font.lineHeight/2+d;d+=l[c].font.lineHeight,o.fillText(l[c].text,s,g)}}}}});
{
"name": "chartjs-plugin-doughnutlabel-rebourne",
"version": "3.0.0-beta.3",
"version": "3.0.0-beta.4",
"description": "Chart.js plugin for doughnut chart to display lines of text in the center",

@@ -5,0 +5,0 @@ "repository": {

@@ -6,2 +6,3 @@ # Chart.js Doughnut plugin to allow for lines of text in the middle

## Demo
Have a look at the [Demo page](https://alexkuc.github.io/chartjs-plugin-doughnutlabel-rebourne/samples/index.html).

@@ -40,4 +41,4 @@

new Chart(ctx, {
plugins: [DoughnutLabel]
})
plugins: [DoughnutLabel],
});
```

@@ -49,18 +50,18 @@

| Option | Description | Label Scope (plugin.labels) | Plugin Scope (options.plugin) | Global Scope (Chart.defaults) |
| --- | --- | :---: | :---: | :---: |
| `paddingPercentage` | add padding when scaling text larger than inner circle (defaults to 10) | | &check; | &check; |
| `labels` | array of labels (objects) | | &check; | |
| `color`| css property | &check; | &check; | &check; |
| `font.family` | css property | &check; | &check; | &check; |
| `font.lineHeight` | css property | &check; | &check; | &check; |
| `font.size` | css property | &check; | &check; | &check; |
| `font.style` | css property | &check; | &check; | &check; |
| `font.weight` | css property | &check; | &check; | &check; |
| `font.string` | all previous font properties in one string separated by space | &check; | &check; | &check; |
| `text` | value of label (can be string or function) | &check; | | |
| `display` | show label or not | &check; | &check; | &check; |
| `api`* | [plugin core api](https://www.chartjs.org/docs/latest/developers/plugins.html#plugin-core-api) (defaults to `beforeDatasetDraw`) | | &check; | &check; |
| Option | Description | Label Scope | Plugin Scope | Global Scope |
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------- | :---------: | :----------: | :----------: |
| `paddingPercentage` | add padding when scaling text larger than inner circle (defaults to 10) | | &check; | &check; |
| `labels` | array of labels (objects) | | &check; | |
| `color` | css property | &check; | &check; | &check; |
| `font.family` | css property | &check; | &check; | &check; |
| `font.lineHeight` | css property | &check; | &check; | &check; |
| `font.size` | css property | &check; | &check; | &check; |
| `font.style` | css property | &check; | &check; | &check; |
| `font.weight` | css property | &check; | &check; | &check; |
| `font.string` | all previous font properties in one string separated by space | &check; | &check; | &check; |
| `text` | value of label (can be string or function) | &check; | | |
| `display` | show label or not | &check; | &check; | &check; |
| `api`\* | [plugin core api](https://www.chartjs.org/docs/latest/developers/plugins.html#plugin-core-api) (defaults to `beforeDatasetDraw`) | | &check; | &check; |
*Option `api` is a really-low level and intended for developers and those who are familar with internal workings of Chart.js (or have experience making plugins).
\*Option `api` is a really-low level and intended for developers and those who are familar with internal workings of Chart.js (or have experience making plugins).

@@ -72,8 +73,10 @@ Note that more specific scope will override more global. For example, if you declare `color` in plugin scope and in label scope, value from label scope will win.

```js
Chart.defaults.plugins.doughnutlabel = {}; // global scope
options: {
plugins: {
doughnutlabel: {
doughnutlabel: { // plugin scope
paddingPercentage: 5,
labels: [
{
{ // label scope
text: 'Text' or functionName,

@@ -121,8 +124,8 @@ font: {

| Command | Purpose |
| :--- | :--- |
| `yarn lint` | perform code linting |
| `yarn build ` | build dist files |
| Command | Purpose |
| :------------------- | :---------------------------------------------- |
| `yarn lint` | perform code linting |
| `yarn build ` | build dist files |
| `yarn build --watch` | build and watch for changes (inc. browser-sync) |
| `yarn package` | create an archive with dist files and samples |
| `yarn package` | create an archive with dist files and samples |

@@ -129,0 +132,0 @@ ## License