UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

3 lines (2 loc) 12.6 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("kendo.data.js"),require("kendo.userevents.js"),require("kendo.dataviz.themes.js")):"function"==typeof define&&define.amd?define(["exports","kendo.data.min","kendo.userevents.min","kendo.dataviz.themes.min"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).kendo=t.kendo||{},t.kendo._globals=t.kendo._globals||{},t.kendo._globals.DatavizTreemap={}))}(this,(function(t){!function(t){var e=Math,i=Array.isArray,n=window.kendo,o=n._outerHeight,r=n._outerWidth,a=n.Class,h=n.ui.Widget,s=n.template,l=n.deepExtend,d=n.data.HierarchicalDataSource,u=n.getter,c=n.dataviz,f=".kendoTreeMap",p="change",v="dataBound",g="itemCreated",m=Number.MAX_VALUE,_="mouseover"+f,w="mouseleave"+f,y=h.extend({init:function(e,i){n.destroy(e),t(e).empty(),h.fn.init.call(this,e,i),this.wrapper=this.element,this._initTheme(this.options),this.element.addClass("k-widget k-treemap"),this._setLayout(),this._originalOptions=l({},this.options),this._initDataSource(),this._attachEvents(),n.notify(this,c.ui)},options:{name:"TreeMap",theme:"sass",autoBind:!0,textField:"text",valueField:"value",colorField:"color"},events:[v,g],_initTheme:function(t){var e=((c.ui.themes||{})[((t||{}).theme||"").toLowerCase()]||{}).treeMap;this.options=l({},e,t)},_attachEvents:function(){this.element.on(_,this._mouseover.bind(this)).on(w,this._mouseleave.bind(this)),this._resizeHandler=this.resize.bind(this,!1),n.onResize(this._resizeHandler)},_setLayout:function(){"horizontal"===this.options.type?(this._layout=new b(!1),this._view=new z(this,this.options)):"vertical"===this.options.type?(this._layout=new b(!0),this._view=new z(this,this.options)):(this._layout=new k,this._view=new x(this,this.options))},_initDataSource:function(){var t=this,e=t.options.dataSource;t._dataChangeHandler=t._onDataChange.bind(t),t.dataSource=d.create(e).bind(p,t._dataChangeHandler),e&&t.options.autoBind&&t.dataSource.fetch()},setDataSource:function(t){var e=this;e.dataSource.unbind(p,e._dataChangeHandler),e.dataSource=t.bind(p,e._dataChangeHandler),t&&e.options.autoBind&&e.dataSource.fetch()},_onDataChange:function(t){var e,i,a=t.node,h=t.items,s=this.options;if(a){if(h.length){var l=this._getByUid(a.uid);for(l.children=[],h=new n.data.Query(h)._sortForGrouping(s.valueField,"desc"),i=0;i<h.length;i++)e=h[i],l.children.push(this._wrapItem(e));var d=this._view.htmlSize(l);this._layout.compute(l.children,l.coord,d),this._setColors(l.children),this._view.render(l)}}else this.element.empty(),e=this._wrapItem(h[0]),this._layout.createRoot(e,r(this.element),o(this.element),"vertical"===this.options.type),this._view.createRoot(e),this._root=e,this._colorIdx=0;for(i=0;i<h.length;i++)h[i].load();a&&this.trigger(v,{node:a})},_setColors:function(t){var e,n,o=this.options.colors,r=o[this._colorIdx%o.length];i(r)&&(e=function(t,e,i){var n=H(t),o=H(e),r=D(t)-D(e)<0,a=[];a.push(t);for(var h=0;h<i;h++){var s={r:I(n.r,o.r,h,i,r),g:I(n.g,o.g,h,i,r),b:I(n.b,o.b,h,i,r)};a.push(T(s))}return a.push(e),a}(r[0],r[1],t.length));for(var a=!1,h=0;h<t.length;h++)S((n=t[h]).color)||(n.color=e?e[h]:r),n.dataItem.hasChildren||(a=!0);a&&this._colorIdx++},_contentSize:function(t){this.view.renderHeight(t)},_wrapItem:function(t){var e={};return S(this.options.valueField)&&(e.value=C(this.options.valueField,t)),S(this.options.colorField)&&(e.color=C(this.options.colorField,t)),S(this.options.textField)&&(e.text=C(this.options.textField,t)),e.level=t.level(),e.dataItem=t,e},_getByUid:function(t){for(var e,i=[this._root];i.length;){if((e=i.pop()).dataItem.uid===t)return e;e.children&&(i=i.concat(e.children))}},dataItem:function(e){var i=t(e).attr(n.attr("uid")),o=this.dataSource;return o&&o.getByUid(i)},findByUid:function(t){return this.element.find(".k-treemap-tile["+n.attr("uid")+"='"+t+"']")},_mouseover:function(e){var i=t(e.target);i.hasClass("k-leaf")&&(this._removeActiveState(),i.removeClass("k-hover").addClass("k-hover"))},_removeActiveState:function(){this.element.find(".k-hover").removeClass("k-hover")},_mouseleave:function(){this._removeActiveState()},destroy:function(){h.fn.destroy.call(this),this.element.off(f),this.dataSource&&this.dataSource.unbind(p,this._dataChangeHandler),this._root=null,n.unbindResize(this._resizeHandler),n.destroy(this.element)},items:function(){return t()},getSize:function(){return n.dimensions(this.element)},_resize:function(){var t=this._root;if(t){var e=this.element,i=e.children();t.coord.width=r(e),t.coord.height=o(e),i.css({width:t.coord.width,height:t.coord.height}),this._resizeItems(t,i)}},_resizeItems:function(t,e){if(t.children&&t.children.length){var i,o,r=e.children(".k-treemap-wrap").children();this._layout.compute(t.children,t.coord,{text:this._view.titleSize(t,e)});for(var a=0;a<t.children.length;a++)i=t.children[a],o=r.filter("["+n.attr("uid")+"='"+i.dataItem.uid+"']"),this._view.setItemSize(i,o),this._resizeItems(i,o)}},setOptions:function(t){var e=t.dataSource;t.dataSource=undefined,this._originalOptions=l(this._originalOptions,t),this.options=l({},this._originalOptions),this._setLayout(),this._initTheme(this.options),h.fn._setEvents.call(this,t),e&&this.setDataSource(d.create(e)),this.options.autoBind&&this.dataSource.fetch()}}),k=a.extend({createRoot:function(t,e,i){t.coord={width:e,height:i,top:0,left:0}},leaf:function(t){return!t.children},layoutChildren:function(t,e){var i,n=e.width*e.height,o=0,r=[];for(i=0;i<t.length;i++)r[i]=parseFloat(t[i].value),o+=r[i];for(i=0;i<r.length;i++)t[i].area=n*r[i]/o;var a=this.layoutHorizontal()?e.height:e.width,h=[t[0]],s=t.slice(1);this.squarify(s,h,a,e)},squarify:function(t,e,i,n){this.computeDim(t,e,i,n)},computeDim:function(t,e,i,n){if(t.length+e.length!=1)if(t.length>=2&&0===e.length&&(e=[t[0]],t=t.slice(1)),0!==t.length){var o=t[0];if(this.worstAspectRatio(e,i)>=this.worstAspectRatio([o].concat(e),i))this.computeDim(t.slice(1),e.concat([o]),i,n);else{var r=this.layoutRow(e,i,n);this.computeDim(t,[],r.dim,r)}}else e.length>0&&this.layoutRow(e,i,n);else{var a=1==t.length?t:e;this.layoutLast(a,i,n)}},layoutLast:function(t,e,i){t[0].coord=i},layoutRow:function(t,e,i){return this.layoutHorizontal()?this.layoutV(t,e,i):this.layoutH(t,e,i)},orientation:"h",layoutVertical:function(){return"v"===this.orientation},layoutHorizontal:function(){return"h"===this.orientation},layoutChange:function(){this.orientation=this.layoutVertical()?"h":"v"},worstAspectRatio:function(t,i){if(!t||0===t.length)return m;for(var n=0,o=0,r=m,a=0;a<t.length;a++){var h=t[a].area;n+=h,r=r<h?r:h,o=o>h?o:h}return e.max(i*i*o/(n*n),n*n/(i*i*r))},compute:function(t,e,i){if(e.width>=e.height&&this.layoutHorizontal()||this.layoutChange(),t&&t.length>0){var n={width:e.width,height:e.height-i.text,top:0,left:0};this.layoutChildren(t,n)}},layoutV:function(t,i,n){var o=0;i=F(this._totalArea(t)/i);for(var r=0;r<t.length;r++){var a=F(t[r].area/i);t[r].coord={height:a,width:i,top:n.top+o,left:n.left},o+=a}var h={height:n.height,width:n.width-i,top:n.top,left:n.left+i};return h.dim=e.min(h.width,h.height),h.dim!=h.height&&this.layoutChange(),h},layoutH:function(t,i,n){for(var o=F(this._totalArea(t)/i),r=n.top,a=0,h=0;h<t.length;h++)t[h].coord={height:o,width:F(t[h].area/o),top:r,left:n.left+a},a+=t[h].coord.width;var s={height:n.height-o,width:n.width,top:n.top+o,left:n.left};return s.dim=e.min(s.width,s.height),s.dim!=s.width&&this.layoutChange(),s},_totalArea:function(t){for(var e=0,i=0;i<t.length;i++)e+=t[i].area;return e}}),x=a.extend({init:function(e,i){this.options=l({},this.options,i),this.treeMap=e,this.element=t(e.element),this.offset=0},titleSize:function(t,e){return e.children(".k-treemap-title").height()||0},htmlSize:function(t){var e=this._getByUid(t.dataItem.uid),i={text:0};if(t.children){if(this._clean(e),this._getText(t)){var n=this._createTitle(t);e.append(n),this._compile(n,t.dataItem),i.text=n.height()}e.append(this._createWrap()),this.offset=(r(e)-e.innerWidth())/2}return i},_compile:function(t,e){},_getByUid:function(t){return this.element.find(".k-treemap-tile["+n.attr("uid")+"='"+t+"']")},render:function(t){var e=this._getByUid(t.dataItem.uid),i=t.children;if(i)for(var n=e.find(".k-treemap-wrap"),o=0;o<i.length;o++){var r=i[o],a=this._createLeaf(r);n.append(a),this._compile(a.children(),r.dataItem),this.treeMap.trigger(g,{element:a})}},createRoot:function(t){var e=this._createLeaf(t);this.element.append(e),this._compile(e.children(),t.dataItem),this.treeMap.trigger(g,{element:e})},_clean:function(t){t.css("background-color",""),t.removeClass("k-leaf"),t.removeClass("k-inverse"),t.empty()},_createLeaf:function(e){return this._createTile(e).css("background-color",e.color).addClass("k-leaf").toggleClass("k-inverse",this._tileColorBrightness(e)>180).toggle(0!==e.value).append(t("<div></div>").html(this._getText(e)))},_createTile:function(e){var i=t("<div class='k-treemap-tile'></div>");return this.setItemSize(e,i),S(e.dataItem)&&S(e.dataItem.uid)&&i.attr(n.attr("uid"),e.dataItem.uid),i},_itemCoordinates:function(t){var e={width:t.coord.width,height:t.coord.height,left:t.coord.left,top:t.coord.top};return e.left&&this.offset?e.width+=2*this.offset:e.width+=this.offset,e.top?e.height+=2*this.offset:e.height+=this.offset,e},setItemSize:function(t,e){var i=this._itemCoordinates(t);e.css({width:i.width,height:i.height,left:i.left,top:i.top})},_getText:function(t){return this.options.template?this._renderTemplate(t):n.htmlEncode(t.text)},_renderTemplate:function(t){return s(this.options.template)({dataItem:t.dataItem,text:t.text})},_createTitle:function(e){return t("<div class='k-treemap-title'></div>").append(t("<div></div>").html(this._getText(e)))},_createWrap:function(){return t("<div class='k-treemap-wrap'></div>")},_tileColorBrightness:function(t){return D(t.color)}}),b=a.extend({createRoot:function(t,e,i,n){t.coord={width:e,height:i,top:0,left:0},t.vertical=n},init:function(t){this.vertical=t,this.quotient=t?1:0},compute:function(t,e,i){if(t.length>0){var n=e.width,o=e.height;this.vertical?o-=i.text:n-=i.text;var r={width:n,height:o,top:0,left:0};this.layoutChildren(t,r)}},layoutChildren:function(t,e){var i,n=e.width*e.height,o=0,r=[];for(i=0;i<t.length;i++){var a=t[i];r[i]=parseFloat(t[i].value),o+=r[i],a.vertical=this.vertical}for(i=0;i<r.length;i++)t[i].area=n*r[i]/o;this.sliceAndDice(t,e)},sliceAndDice:function(t,e){var i=this._totalArea(t);t[0].level%2===this.quotient?this.layoutHorizontal(t,e,i):this.layoutVertical(t,e,i)},layoutHorizontal:function(t,e,i){for(var n=0,o=0;o<t.length;o++){var r=t[o],a=r.area/(i/e.width);r.coord={height:e.height,width:a,top:e.top,left:e.left+n},n+=a}},layoutVertical:function(t,e,i){for(var n=0,o=0;o<t.length;o++){var r=t[o],a=r.area/(i/e.height);r.coord={height:a,width:e.width,top:e.top+n,left:e.left},n+=a}},_totalArea:function(t){for(var e=0,i=0;i<t.length;i++)e+=t[i].area;return e}}),z=x.extend({htmlSize:function(t){var e=this._getByUid(t.dataItem.uid),i={text:0,offset:0};if(t.children){if(this._clean(e),this._getText(t)){var n=this._createTitle(t);e.append(n),this._compile(n,t.dataItem),t.vertical?i.text=n.height():i.text=n.width()}e.append(this._createWrap()),this.offset=(r(e)-e.innerWidth())/2}return i},titleSize:function(t,e){return(t.vertical?e.children(".k-treemap-title").height():e.children(".k-treemap-title-vertical").width())||0},_createTitle:function(e){return(e.vertical?t("<div class='k-treemap-title'></div>"):t("<div class='k-treemap-title-vertical'></div>")).append(t("<div></div>").html(this._getText(e)))}});function C(t,e){return null===e?e:u(t,!0)(e)}function S(t){return void 0!==t}function I(t,i,n,o,r){var a=e.min(e.abs(t),e.abs(i)),h=e.max(e.abs(t),e.abs(i)),s=(h-a)/(o+1)*(n+1);return r?a+s:h-s}function T(t){return"#"+A(t.r)+A(t.g)+A(t.b)}function H(t){var e=function(t){var e=t.length,i={};3===e?(i.r=t[0],i.g=t[1],i.b=t[2]):(i.r=t.substring(0,2),i.g=t.substring(2,4),i.b=t.substring(4,6));return i}(t=t.replace("#",""));return{r:B(e.r),g:B(e.g),b:B(e.b)}}function A(t){var i=e.round(t).toString(16).toUpperCase();return 1===i.length&&(i="0"+i),i}function B(t){return parseInt(t.toString(16),16)}function D(t){var i=0;return t&&(t=H(t),i=e.sqrt(.241*t.r*t.r+.691*t.g*t.g+.068*t.b*t.b)),i}function F(t){var i=e.pow(10,4);return e.round(t*i)/i}c.ui.plugin(y)}(window.kendo.jQuery);var e=kendo;t.__meta__={id:"dataviz.treeMap",name:"TreeMap",category:"dataviz",description:"The Kendo DataViz TreeMap",depends:["data","userevents","dataviz.themes"]},t.default=e,Object.defineProperty(t,"__esModule",{value:!0})})); //# sourceMappingURL=kendo.dataviz.treemap.min.js.map