chartjs-chart-treemap
Advanced tools
Comparing version 0.2.1 to 0.2.2
@@ -6,4 +6,4 @@ { | ||
"license": "MIT", | ||
"version": "0.2.1", | ||
"version": "0.2.2", | ||
"main": "dist/chartjs-chart-treemap.js" | ||
} |
/*! | ||
* chartjs-chart-treemap v0.2.1 | ||
* chartjs-chart-treemap v0.2.2 | ||
* https://github.com/kurkle/chartjs-chart-treemap#readme | ||
@@ -354,3 +354,8 @@ * (c) 2019 Jukka Kurkela | ||
var resolve = Chart.helpers.options.resolve; | ||
var defaults = Chart.defaults; | ||
var helpers = Chart.helpers; | ||
var optionHelpers = helpers.options; | ||
var parseFont = optionHelpers._parseFont; | ||
var resolve = optionHelpers.resolve; | ||
var valueOrDefault = helpers.valueOrDefault; | ||
@@ -380,3 +385,10 @@ function rectNotEqual(r1, r2) { | ||
function buildData(dataset, mainRect) { | ||
function drawCaption(rect, font) { | ||
var w = rect.width || rect.w; | ||
var h = rect.height || rect.h; | ||
var min = font.lineHeight * 2; | ||
return w > min && h > min; | ||
} | ||
function buildData(dataset, mainRect, font) { | ||
var key = dataset.key || ''; | ||
@@ -398,5 +410,6 @@ var tree = dataset.tree || []; | ||
subRect = {x: sq.x + sp, y: sq.y + sp, w: sq.w - 2 * sp, h: sq.h - 2 * sp}; | ||
if (sq.h > 25) { | ||
subRect.y += 15; | ||
subRect.h -= 15; | ||
if (drawCaption(sq, font)) { | ||
subRect.y += font.lineHeight; | ||
subRect.h -= font.lineHeight; | ||
} | ||
@@ -418,2 +431,13 @@ ret.push.apply(ret, recur(gidx + 1, subRect, sq.g, sq.s)); | ||
function parseFontOptions(options) { | ||
return helpers.extend(parseFont({ | ||
fontFamily: valueOrDefault(options.fontFamily, defaults.fontFamily), | ||
fontSize: valueOrDefault(options.fontSize, defaults.fontSize), | ||
fontStyle: valueOrDefault(options.fontStyle, defaults.fontStyle), | ||
lineHeight: valueOrDefault(options.lineHeight, defaults.lineHeight) | ||
}), { | ||
color: resolve([options.fontColor, defaults.fontColor, defaults.global.defaultFontColor]) | ||
}); | ||
} | ||
var Controller = Chart.DatasetController.extend({ | ||
@@ -428,2 +452,3 @@ | ||
var groups = dataset.groups || (dataset.groups = []); | ||
var font = parseFontOptions(dataset); | ||
var data = meta.data || []; | ||
@@ -440,3 +465,3 @@ var area = me.chart.chartArea; | ||
me._key = key; | ||
dataset.data = buildData(dataset, mainRect); | ||
dataset.data = buildData(dataset, mainRect, font); | ||
me.resyncElements(); | ||
@@ -478,3 +503,5 @@ } | ||
borderSkipped: options.borderSkipped, | ||
borderWidth: options.borderWidth | ||
borderWidth: options.borderWidth, | ||
font: parseFont(options), | ||
fontColor: options.fontColor | ||
}; | ||
@@ -500,6 +527,6 @@ | ||
rect.draw(); | ||
if (vm.height > 25 && item.g) { | ||
if (drawCaption(vm, vm.font) && item.g) { | ||
ctx.save(); | ||
ctx.fillStyle = '#000'; | ||
ctx.font = '12px serif'; | ||
ctx.fillStyle = vm.fontColor; | ||
ctx.font = vm.font.string; | ||
ctx.beginPath(); | ||
@@ -547,2 +574,6 @@ ctx.rect(vm.left, vm.top, vm.width, vm.height); | ||
'borderWidth', | ||
'fontColor', | ||
'fontFamily', | ||
'fontSize', | ||
'fontStyle', | ||
'spacing' | ||
@@ -564,3 +595,3 @@ ]; | ||
var defaults = { | ||
var defaults$1 = { | ||
hover: { | ||
@@ -595,3 +626,3 @@ mode: 'nearest', | ||
Chart.controllers.treemap = Controller; | ||
Chart.defaults.treemap = defaults; | ||
Chart.defaults.treemap = defaults$1; | ||
@@ -598,0 +629,0 @@ Chart.Tooltip.positioners.treemap = function(elements) { |
/*! | ||
* chartjs-chart-treemap v0.2.1 | ||
* chartjs-chart-treemap v0.2.2 | ||
* https://github.com/kurkle/chartjs-chart-treemap#readme | ||
@@ -7,2 +7,2 @@ * (c) 2019 Jukka Kurkela | ||
*/ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("chart.js")):"function"==typeof define&&define.amd?define(["chart.js"],e):e((t=t||self).Chart)}(this,function(t){"use strict";function e(t){var e=typeof t;return"function"===e||"object"===e&&!!t}t=t&&t.hasOwnProperty("default")?t.default:t;var r={flatten:function(t){const e=[...t],r=[];for(;e.length;){const t=e.pop();Array.isArray(t)?e.push(...t):r.push(t)}return r.reverse()},group:function(t,e,r,n,i){var a,s,o,h,u=Object.create(null),l=Object.create(null),d=[];for(s=0,o=t.length;s<o;++s)h=t[s],n&&h[n]!==i||((a=h[e]||"")in u||(u[a]=0,l[a]=[]),u[a]+=+h[r],l[a].push(h));return Object.keys(u).forEach(function(t){(h={children:l[t]})[r]=+u[t],h[e]=t,n&&(h[n]=i),d.push(h)}),d},index:function(t,r){var n,i,a=t.length;if(!a)return r;for(r=(i=e(t[0]))?r:"v",n=0,a=t.length;n<a;++n)i?t[n]._idx=n:t[n]={v:t[n],_idx:n};return r},isObject:e,sort:function(t,e){e?t.sort(function(t,r){return+r[e]-+t[e]}):t.sort(function(t,e){return+e-+t})},sum:function(t,e){var r,n,i;for(r=0,n=0,i=t.length;n<i;++n)r+=e?+t[n][e]:+t[n];return r}};function n(t,e){return+(Math.round(t+"e+"+e)+"e-"+e)}function i(t,e,r,n){var i=t._normalized,a=e*i/r,s=Math.sqrt(i*a),o=i/s;return{d1:s,d2:o,w:"_ix"===n?s:o,h:"_ix"===n?o:s}}function a(t,e,r,i){var a={x:n(t.x+t._ix,4),y:n(t.y+t._iy,4),w:n(r.w,4),h:n(r.h,4),a:e._normalized,v:e.value,s:i,_data:e._data};return e.group&&(a.g=e.group,a.l=e.level,a.gs=e.groupSum),a}class s{constructor(t){var e=this;e.x=t.x||t.left||0,e.y=t.y||t.top||0,e._ix=0,e._iy=0,e.w=t.w||t.width||t.right-t.left,e.h=t.h||t.height||t.bottom-t.top}get area(){return this.w*this.h}get iw(){return this.w-this._ix}get ih(){return this.h-this._iy}get dir(){var t=this.ih;return t<=this.iw&&t>0?"y":"x"}get side(){return"x"===this.dir?this.iw:this.ih}map(t){var e,r,n,s=this,o=[],h=t.nsum,u=t.get(),l=u.length,d=s.dir,p=s.side,c=p*p,g="x"===d?"_ix":"_iy",f=h*h,m=0,x=0;for(e=0;e<l;++e)x+=(n=i(r=u[e],c,f,g)).d1,n.d2>m&&(m=n.d2),o.push(a(s,r,n,t.sum)),s[g]+=n.d1;return s["y"===d?"_ix":"_iy"]+=m,s[g]-=x,o}}const o=Math.min,h=Math.max;function u(t,e){var r=+e[t.key],n=r*t.ratio;return e._normalized=n,{min:o(t.min,r),max:h(t.max,r),sum:t.sum+r,nmin:o(t.nmin,n),nmax:h(t.nmax,n),nsum:t.nsum+n}}function l(t,e,r){t._arr.push(e),function(t,e){Object.assign(t,e)}(t,r)}class d{constructor(t,e){this.key=t,this.ratio=e,this.reset()}get length(){return this._arr.length}reset(){var t=this;t._arr=[],t._hist=[],t.sum=0,t.nsum=0,t.min=1/0,t.max=-1/0,t.nmin=1/0,t.nmax=-1/0}push(t){l(this,t,u(this,t))}pushIf(t,e,...r){var n,i=u(this,t);if(!e((n=this,{min:n.min,max:n.max,sum:n.sum,nmin:n.nmin,nmax:n.nmax,nsum:n.nsum}),i,r))return t;l(this,t,i)}get(){return this._arr}}function p(t,e,r){if(0===t.sum)return!0;var[n]=r,i=t.nsum*t.nsum,a=e.nsum*e.nsum,s=n*n,o=Math.max(s*t.nmax/i,i/(s*t.nmin));return Math.max(s*e.nmax/a,a/(s*e.nmin))<=o}function c(t,e,n,i,a,o){var h,u,l,c,g=r.sum(t,n),f=[],m=new s(e),x=new d("value",m.area/g),y=m.side,v=t.length;if(!v)return f;function _(t){return i&&l[t][i]}for(l=t.slice(),n=r.index(l,n),r.sort(l,n),h=0;h<v;++h)u={value:(c=h,n?+l[c][n]:+l[c]),groupSum:o,_data:t[l[h]._idx]},i&&(u.level=a,u.group=_(h)),(u=x.pushIf(u,p,y))&&(f.push(m.map(x)),y=m.side,x.reset(),x.push(u));return x.length&&f.push(m.map(x)),r.flatten(f)}var g=t.helpers.options.resolve;var f=t.DatasetController.extend({dataElementType:t.elements.Rectangle,update:function(t){var e,n,i,a,s,o=this,h=o.getMeta(),u=o.getDataset(),l=u.groups||(u.groups=[]),d=h.data||[],p=o.chart.chartArea,g=u.key||"";for(i={x:p.left,y:p.top,w:p.right-p.left,h:p.bottom-p.top},!t&&(a=o._rect,s=i,a&&s&&a.x===s.x&&a.y===s.y&&a.w===s.w&&a.h===s.h)&&o._key===g&&!function(t,e){var r,n;if(t.lenght!==e.length)return!0;for(r=0,n=t.length;r<n;++r)if(t[r]!==e[r])return!0;return!1}(o._groups,l)||(o._rect=i,o._groups=l.slice(),o._key=g,u.data=function(t,e){var n=t.key||"",i=t.tree||[],a=t.groups||[],s=a.length,o=(t.spacing||0)+(t.borderWidth||0);return!i.length&&t.data.length&&(i=t.tree=t.data),s?function t(e,h,u,l){var d,p=a[e],g=e>0&&a[e-1],f=c(r.group(i,p,n,g,u),h,n,p,e,l),m=f.slice();return e<s-1&&f.forEach(function(r){d={x:r.x+o,y:r.y+o,w:r.w-2*o,h:r.h-2*o},r.h>25&&(d.y+=15,d.h-=15),m.push.apply(m,t(e+1,d,r.g,r.s))}),m}(0,e):c(i,e,n)}(u,i),o.resyncElements()),e=0,n=d.length;e<n;++e)o.updateElement(d[e],e,t)},updateElement:function(t,e,r){var n=this.index,i=this.getDataset().data[e],a=this._resolveElementOptions(t,e),s=r?0:i.h-2*a.spacing,o=r?0:i.w-2*a.spacing,h=i.x+o/2+a.spacing,u=i.y+s/2+a.spacing,l=s/2;t._options=a,t._datasetIndex=n,t._index=e,t.hidden=s<=a.spacing||o<=a.spacing,t._model={x:h,base:u-l,y:u+l,top:i.y,left:i.x,width:o,height:s,backgroundColor:a.backgroundColor,borderColor:a.borderColor,borderSkipped:a.borderSkipped,borderWidth:a.borderWidth},t.pivot()},draw:function(){var t,e,r,n,i,a=this.getMeta().data||[],s=this.getDataset(),o=(s.groups||[]).length-1,h=s.data||[],u=this.chart.ctx;for(t=0,e=a.length;t<e;++t)i=(r=a[t])._view,n=h[t],r.hidden||(r.draw(),i.height>25&&n.g&&(u.save(),u.fillStyle="#000",u.font="12px serif",u.beginPath(),u.rect(i.left,i.top,i.width,i.height),u.clip(),"l"in n&&n.l!==o?(u.textAlign="start",u.textBaseline="top",u.fillText(n.g,i.left+i.borderWidth+3,i.top+i.borderWidth+3)):(u.textAlign="center",u.textBaseline="middle",u.fillText(n.g,i.left+i.width/2,i.top+i.height/2)),u.restore()))},_resolveElementOptions:function(t,e){var r,n,i,a=this.chart,s=this.getDataset(),o=a.options.elements.rectangle,h={},u={chart:a,dataIndex:e,dataset:s,datasetIndex:this.index},l=["backgroundColor","borderColor","borderSkipped","borderWidth","spacing"];for(r=0,n=l.length;r<n;++r)h[i=l[r]]=g([s[i],o[i]],u,e);return h}});t.controllers.treemap=f,t.defaults.treemap={hover:{mode:"nearest",intersect:!0},tooltips:{mode:"nearest",position:"treemap",intersect:!0},scales:{xAxes:[{type:"linear",display:!1}],yAxes:[{type:"linear",display:!1}]},elements:{rectangle:{borderSkipped:!1,borderWidth:0,spacing:.5}}},t.Tooltip.positioners.treemap=function(t){if(!t.length)return!1;var e=t[0]._view;return{x:e.x,y:e.y-e.height/2}}}); | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("chart.js")):"function"==typeof define&&define.amd?define(["chart.js"],e):e((t=t||self).Chart)}(this,function(t){"use strict";function e(t){var e=typeof t;return"function"===e||"object"===e&&!!t}t=t&&t.hasOwnProperty("default")?t.default:t;var n={flatten:function(t){const e=[...t],n=[];for(;e.length;){const t=e.pop();Array.isArray(t)?e.push(...t):n.push(t)}return n.reverse()},group:function(t,e,n,r,i){var o,a,s,h,u=Object.create(null),l=Object.create(null),d=[];for(a=0,s=t.length;a<s;++a)h=t[a],r&&h[r]!==i||((o=h[e]||"")in u||(u[o]=0,l[o]=[]),u[o]+=+h[n],l[o].push(h));return Object.keys(u).forEach(function(t){(h={children:l[t]})[n]=+u[t],h[e]=t,r&&(h[r]=i),d.push(h)}),d},index:function(t,n){var r,i,o=t.length;if(!o)return n;for(n=(i=e(t[0]))?n:"v",r=0,o=t.length;r<o;++r)i?t[r]._idx=r:t[r]={v:t[r],_idx:r};return n},isObject:e,sort:function(t,e){e?t.sort(function(t,n){return+n[e]-+t[e]}):t.sort(function(t,e){return+e-+t})},sum:function(t,e){var n,r,i;for(n=0,r=0,i=t.length;r<i;++r)n+=e?+t[r][e]:+t[r];return n}};function r(t,e){return+(Math.round(t+"e+"+e)+"e-"+e)}function i(t,e,n,r){var i=t._normalized,o=e*i/n,a=Math.sqrt(i*o),s=i/a;return{d1:a,d2:s,w:"_ix"===r?a:s,h:"_ix"===r?s:a}}function o(t,e,n,i){var o={x:r(t.x+t._ix,4),y:r(t.y+t._iy,4),w:r(n.w,4),h:r(n.h,4),a:e._normalized,v:e.value,s:i,_data:e._data};return e.group&&(o.g=e.group,o.l=e.level,o.gs=e.groupSum),o}class a{constructor(t){var e=this;e.x=t.x||t.left||0,e.y=t.y||t.top||0,e._ix=0,e._iy=0,e.w=t.w||t.width||t.right-t.left,e.h=t.h||t.height||t.bottom-t.top}get area(){return this.w*this.h}get iw(){return this.w-this._ix}get ih(){return this.h-this._iy}get dir(){var t=this.ih;return t<=this.iw&&t>0?"y":"x"}get side(){return"x"===this.dir?this.iw:this.ih}map(t){var e,n,r,a=this,s=[],h=t.nsum,u=t.get(),l=u.length,d=a.dir,f=a.side,c=f*f,p="x"===d?"_ix":"_iy",g=h*h,m=0,x=0;for(e=0;e<l;++e)x+=(r=i(n=u[e],c,g,p)).d1,r.d2>m&&(m=r.d2),s.push(o(a,n,r,t.sum)),a[p]+=r.d1;return a["y"===d?"_ix":"_iy"]+=m,a[p]-=x,s}}const s=Math.min,h=Math.max;function u(t,e){var n=+e[t.key],r=n*t.ratio;return e._normalized=r,{min:s(t.min,n),max:h(t.max,n),sum:t.sum+n,nmin:s(t.nmin,r),nmax:h(t.nmax,r),nsum:t.nsum+r}}function l(t,e,n){t._arr.push(e),function(t,e){Object.assign(t,e)}(t,n)}class d{constructor(t,e){this.key=t,this.ratio=e,this.reset()}get length(){return this._arr.length}reset(){var t=this;t._arr=[],t._hist=[],t.sum=0,t.nsum=0,t.min=1/0,t.max=-1/0,t.nmin=1/0,t.nmax=-1/0}push(t){l(this,t,u(this,t))}pushIf(t,e,...n){var r,i=u(this,t);if(!e((r=this,{min:r.min,max:r.max,sum:r.sum,nmin:r.nmin,nmax:r.nmax,nsum:r.nsum}),i,n))return t;l(this,t,i)}get(){return this._arr}}function f(t,e,n){if(0===t.sum)return!0;var[r]=n,i=t.nsum*t.nsum,o=e.nsum*e.nsum,a=r*r,s=Math.max(a*t.nmax/i,i/(a*t.nmin));return Math.max(a*e.nmax/o,o/(a*e.nmin))<=s}function c(t,e,r,i,o,s){var h,u,l,c,p=n.sum(t,r),g=[],m=new a(e),x=new d("value",m.area/p),y=m.side,v=t.length;if(!v)return g;function _(t){return i&&l[t][i]}for(l=t.slice(),r=n.index(l,r),n.sort(l,r),h=0;h<v;++h)u={value:(c=h,r?+l[c][r]:+l[c]),groupSum:s,_data:t[l[h]._idx]},i&&(u.level=o,u.group=_(h)),(u=x.pushIf(u,f,y))&&(g.push(m.map(x)),y=m.side,x.reset(),x.push(u));return x.length&&g.push(m.map(x)),n.flatten(g)}var p=t.defaults,g=t.helpers,m=g.options,x=m._parseFont,y=m.resolve,v=g.valueOrDefault;function _(t,e){var n=t.width||t.w,r=t.height||t.h,i=2*e.lineHeight;return n>i&&r>i}var b=t.DatasetController.extend({dataElementType:t.elements.Rectangle,update:function(t){var e,r,i,o,a,s,h=this,u=h.getMeta(),l=h.getDataset(),d=l.groups||(l.groups=[]),f=(e=l,g.extend(x({fontFamily:v(e.fontFamily,p.fontFamily),fontSize:v(e.fontSize,p.fontSize),fontStyle:v(e.fontStyle,p.fontStyle),lineHeight:v(e.lineHeight,p.lineHeight)}),{color:y([e.fontColor,p.fontColor,p.global.defaultFontColor])})),m=u.data||[],b=h.chart.chartArea,w=l.key||"";for(o={x:b.left,y:b.top,w:b.right-b.left,h:b.bottom-b.top},!t&&(a=h._rect,s=o,a&&s&&a.x===s.x&&a.y===s.y&&a.w===s.w&&a.h===s.h)&&h._key===w&&!function(t,e){var n,r;if(t.lenght!==e.length)return!0;for(n=0,r=t.length;n<r;++n)if(t[n]!==e[n])return!0;return!1}(h._groups,d)||(h._rect=o,h._groups=d.slice(),h._key=w,l.data=function(t,e,r){var i=t.key||"",o=t.tree||[],a=t.groups||[],s=a.length,h=(t.spacing||0)+(t.borderWidth||0);return!o.length&&t.data.length&&(o=t.tree=t.data),s?function t(e,u,l,d){var f,p=a[e],g=e>0&&a[e-1],m=c(n.group(o,p,i,g,l),u,i,p,e,d),x=m.slice();return e<s-1&&m.forEach(function(n){f={x:n.x+h,y:n.y+h,w:n.w-2*h,h:n.h-2*h},_(n,r)&&(f.y+=r.lineHeight,f.h-=r.lineHeight),x.push.apply(x,t(e+1,f,n.g,n.s))}),x}(0,e):c(o,e,i)}(l,o,f),h.resyncElements()),r=0,i=m.length;r<i;++r)h.updateElement(m[r],r,t)},updateElement:function(t,e,n){var r=this.index,i=this.getDataset().data[e],o=this._resolveElementOptions(t,e),a=n?0:i.h-2*o.spacing,s=n?0:i.w-2*o.spacing,h=i.x+s/2+o.spacing,u=i.y+a/2+o.spacing,l=a/2;t._options=o,t._datasetIndex=r,t._index=e,t.hidden=a<=o.spacing||s<=o.spacing,t._model={x:h,base:u-l,y:u+l,top:i.y,left:i.x,width:s,height:a,backgroundColor:o.backgroundColor,borderColor:o.borderColor,borderSkipped:o.borderSkipped,borderWidth:o.borderWidth,font:x(o),fontColor:o.fontColor},t.pivot()},draw:function(){var t,e,n,r,i,o=this.getMeta().data||[],a=this.getDataset(),s=(a.groups||[]).length-1,h=a.data||[],u=this.chart.ctx;for(t=0,e=o.length;t<e;++t)i=(n=o[t])._view,r=h[t],n.hidden||(n.draw(),_(i,i.font)&&r.g&&(u.save(),u.fillStyle=i.fontColor,u.font=i.font.string,u.beginPath(),u.rect(i.left,i.top,i.width,i.height),u.clip(),"l"in r&&r.l!==s?(u.textAlign="start",u.textBaseline="top",u.fillText(r.g,i.left+i.borderWidth+3,i.top+i.borderWidth+3)):(u.textAlign="center",u.textBaseline="middle",u.fillText(r.g,i.left+i.width/2,i.top+i.height/2)),u.restore()))},_resolveElementOptions:function(t,e){var n,r,i,o=this.chart,a=this.getDataset(),s=o.options.elements.rectangle,h={},u={chart:o,dataIndex:e,dataset:a,datasetIndex:this.index},l=["backgroundColor","borderColor","borderSkipped","borderWidth","fontColor","fontFamily","fontSize","fontStyle","spacing"];for(n=0,r=l.length;n<r;++n)h[i=l[n]]=y([a[i],s[i]],u,e);return h}});t.controllers.treemap=b,t.defaults.treemap={hover:{mode:"nearest",intersect:!0},tooltips:{mode:"nearest",position:"treemap",intersect:!0},scales:{xAxes:[{type:"linear",display:!1}],yAxes:[{type:"linear",display:!1}]},elements:{rectangle:{borderSkipped:!1,borderWidth:0,spacing:.5}}},t.Tooltip.positioners.treemap=function(t){if(!t.length)return!1;var e=t[0]._view;return{x:e.x,y:e.y-e.height/2}}}); |
{ | ||
"name": "chartjs-chart-treemap", | ||
"version": "0.2.1", | ||
"version": "0.2.2", | ||
"description": "Chart.js module for creating treemap charts", | ||
@@ -5,0 +5,0 @@ "main": "dist/chartjs-chart-treemap.js", |
@@ -32,2 +32,6 @@ # chartjs-chart-treemap | ||
tree: [6,6,5,4,3,2,2,1], | ||
fontColor: '#000', | ||
fontFamily: 'serif', | ||
fontSize: 12, | ||
fontStyle: 'normal', | ||
backgroundColor: function(ctx) { | ||
@@ -34,0 +38,0 @@ var value = ctx.dataset.data[ctx.dataIndex]; |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
25301
590
74