taucharts/dist/plugins/legend.js

Data-focused charting library based on D3

/*!
 * /*
 * taucharts@2.8.0 (2020-02-26)
 * Copyright 2020 Targetprocess, Inc.
 * Licensed under Apache License 2.0
 * * /
 * 
 */
!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("taucharts"),require("d3-format"));else if("function"==typeof define&&define.amd)define(["taucharts","d3-format"],t);else{var r="object"==typeof exports?t(require("taucharts"),require("d3-format")):t(e.Taucharts,e.d3);for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(window,(function(e,t){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var a=t[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,r),a.l=!0,a.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)r.d(n,a,function(t){return e[t]}.bind(null,a));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=28)}({0:function(t,r){t.exports=e},28:function(e,t,r){"use strict";r.r(t);var n,a,i=r(0),o=r.n(i),c=r(9),l=o.a.api.utils,s=o.a.api.pluginsSDK,u=0,d=o.a.api.utils.xml,h=function(e,t){var r=e[0],n=e[1],a=(n-r)/(t-1),i=l.range(t-2).map((function(e){return r+a*(e+1)}));return[r].concat(i).concat(n)},_=function(e){return Math.log(e)/Math.LN10},f=function(e){return 0===e?0:Math.floor(_(Math.abs(e)))},g=(n=/\.0+([^\d].*)?$/,a=/(\.\d+?)0+([^\d].*)?$/,function(e){return e.replace(n,"$1").replace(a,"$1$2")}),m=c.format(".3s"),p=function(e){return g(m(e))},v=function(e,t){var r=Math.max(Math.abs(e),Math.abs(t)),n=f(r),a=e*t>0?Math.abs(t-e):r,i=f(a),o=Math.abs(n-i);return Math.abs(n)>3&&o<=3?p:function(e){var t=f(r-e),n=Math.min((i<0?Math.abs(i):0)+(t<i?1:0),20);return g(e.toFixed(n))}};function b(e){var t=!0,r=l.defaults(e||{},{formatters:{},onSelect:function(){}}),n=function(e){return null===e||""===e||void 0===e},a=function(e){return e.every((function(e){return l.isDate(e)}))},i=function(e,t){return function(r){var a=r[e],i=JSON.stringify(n(a)?null:a);return t===i}},o=function(e,t,r,n){e.addEventListener(t,(function(e){for(var t=e.target;t!==e.currentTarget&&null!==t;)t.matches(r)&&n(e,t),t=t.parentNode}))};return{init:function(e){var t=this;this.instanceId=++u,this._chart=e,this._currentFilters={},this._legendColorByScaleId={},this._legendOrderState={};var n=this._chart.getSpec(),a=function(e){return function(t,r){var a=n.scales[r];return a.type===e&&a.dim&&t.push(r),t}};this._color=Object.keys(n.scales).reduce(a("color"),[]).filter((function(t){return e.getScaleInfo(t).discrete})),this._fill=Object.keys(n.scales).reduce(a("color"),[]).filter((function(t){return!e.getScaleInfo(t).discrete})),this._size=Object.keys(n.scales).reduce(a("size"),[]);var i=this._color.length>0,c=this._fill.length>0,l=this._size.length>0;if(this._assignStaticBrewersOrEx(),i||c||l){switch(r.position){case"left":this._container=this._chart.insertToLeftSidebar(this._containerTemplate);break;case"right":this._container=this._chart.insertToRightSidebar(this._containerTemplate);break;case"top":this._container=this._chart.insertToHeader(this._containerTemplate);break;case"bottom":this._container=this._chart.insertToFooter(this._containerTemplate);break;default:this._container=this._chart.insertToRightSidebar(this._containerTemplate)}i&&(o(this._container,"click",".tau-chart__legend__reset",(function(e,r){t._toggleLegendItem(r,"reset")})),o(this._container,"click",".tau-chart__legend__item-color",(function(e,r){var n=e.ctrlKey||e.target.matches(".tau-chart__legend__guide--color__overlay")?"leave-others":"focus-single";t._toggleLegendItem(r,n)})),o(this._container,"mouseover",".tau-chart__legend__item-color",(function(e,r){t._highlightToggle(r,!0)})),o(this._container,"mouseout",".tau-chart__legend__item-color",(function(e,r){t._highlightToggle(r,!1)})))}},destroy:function(){var e=this._currentFilters,t=this._chart;Object.keys(e).forEach((function(r){return t.removeFilter(e[r])})),this._container&&this._container.parentElement&&(this._clearPanel(),this._container.parentElement.removeChild(this._container))},onSpecReady:function(e,t){this._formatters=s.getFieldFormatters(t,r.formatters)},_getFormat:function(e){return this._formatters[e]?this._formatters[e].format:function(e){return String(e)}},onRender:function(){var e=this;if(t&&r.selectedCategories&&0!==r.selectedCategories.length){var n=this._getLegendColorByScales();return Object.keys(n).forEach((function(t){n[t].legendColorItems.forEach((function(t){var n=t.value,a=t.dim;if(-1===r.selectedCategories.indexOf(JSON.parse(n))){var o=a+n,c=i(a,n);e._currentFilters[o]=e._chart.addFilter({tag:"legend",predicate:function(e){return!c(e)}})}}))})),t=!1,void this._chart.refresh()}this._clearPanel(),this._drawColorLegend(),this._drawFillLegend(),this._drawSizeLegend()},_containerTemplate:'<div class="tau-chart__legend"></div>',_template:l.template(['<div class="tau-chart__legend__wrap">',"<%=top%>",'<div class="tau-chart__legend__title"><%=name%></div>',"<%=items%>","</div>"].join("")),_itemTemplate:l.template(["<div data-scale-id='<%= scaleId %>' data-dim='<%= dim %>' data-value='<%= value %>' class=\"tau-chart__legend__item tau-chart__legend__item-color <%=classDisabled%>\">",'   <div class="tau-chart__legend__guide__wrap">','   <div class="tau-chart__legend__guide tau-chart__legend__guide--color <%=cssClass%>"','        style="background-color: <%=cssColor%>; border-color: <%=borderColor%>;">','       <div class="tau-chart__legend__guide--color__overlay">',"       </div>","   </div>","   </div>",'   <span class="tau-chart__legend__guide__label"><%=label%></span>',"</div>"].join("")),_resetTemplate:l.template(['<div class="tau-chart__legend__reset <%=classDisabled%>">','    <div role="button" class="tau-chart__button">Reset</div>',"</div>"].join("")),_clearPanel:function(){this._container&&(clearTimeout(this._scrollTimeout),this._getScrollContainer().removeEventListener("scroll",this._scrollListener),this._container.innerHTML="")},_drawFillLegend:function(){var e=this;e._fill.forEach((function(t){var r,n,i=e._chart.select((function(e){return e.config.color===t}))[0];if(i){var o=i.config.guide||{},c=i.getScale("color"),u=c.domain().sort((function(e,t){return e-t})),_=a(u),f=_?u.map(Number):u,g=v(f[0],f[f.length-1]),m=function(){var t=e._chart.getSpec(),r=s.extractFieldsFormatInfo(t)[c.dim].format;return r||(r=function(e){return new Date(e)}),function(e){return String(r(e))}}(),p=_?m:g,b=c.brewer.length,y=((o.color||{}).label||{}).text||c.dim,x=function(e){return 13*e.length*.618},S=c.isInteger?(f[1]-f[0])%3==0?4:(f[1]-f[0])%2==0?3:2:3,w=h(f,S),M=(_?w.map((function(e){return new Date(e)})):w).map(p);M[0]===M[M.length-1]&&(M=[M[0]]),e._container.insertAdjacentHTML("beforeend",e._template({name:l.escape(y),top:null,items:'<div class="tau-chart__legend__gradient-wrapper"></div>'}));var T=e._container.lastElementChild.querySelector(".tau-chart__legend__gradient-wrapper"),C=T.getBoundingClientRect().width,L=!1;M.reduce((function(e,t){return e+x(t)}),0)>C&&(M.length>1&&x(M[0])+x(M[M.length-1])>C?L=!0:M=[M[0],M[M.length-1]]);var j=L?{width:C,height:120,barX:0,barY:0,barWidth:20,barHeight:120,textAnchor:"start",textX:l.range(S).map((function(){return 25})),textY:1===M.length?68.034:M.map((function(e,t){var r=(M.length-1-t)/(M.length-1);return 13*(1-r)+120*r-2.483}))}:(r=x(M[0])/2,n=x(M[M.length-1])/2,{width:C,height:41,barX:0,barY:0,barWidth:C,barHeight:20,textAnchor:"middle",textX:1===M.length?[C/2]:M.map((function(e,t){var a=t/(M.length-1);return r*(1-a)+(C-n)*a})),textY:l.range(S).map((function(){return 41}))}),F=h(f,b).map((function(e,t){return d("stop",{offset:t/(b-1)*100+"%",style:"stop-color:"+c(e)+';stop-opacity:1"'})})),A="legend-gradient-"+e.instanceId,O=d.apply(void 0,["svg",{class:"tau-chart__legend__gradient",width:j.width,height:j.height},d("defs",d.apply(void 0,["linearGradient",{id:A,x1:"0%",y1:L?"100%":"0%",x2:L?"0%":"100%",y2:"0%"}].concat(F))),d("rect",{class:"tau-chart__legend__gradient__bar",x:j.barX,y:j.barY,width:j.barWidth,height:j.barHeight,fill:"url(#"+A+")"})].concat(M.map((function(e,t){return d("text",{x:j.textX[t],y:j.textY[t],"text-anchor":j.textAnchor},e)}))));T.insertAdjacentHTML("beforeend",O)}}))},_drawSizeLegend:function(){var e=this;e._size.forEach((function(t){var r=e._chart.select((function(e){return e.config.size===t}))[0];if(r){var n=r.config.guide||{},a=r.getScale("size"),i=a.domain().sort((function(e,t){return e-t}));if(!Array.isArray(i)||!i.every(isFinite))return;var o=((n.size||{}).label||{}).text||a.dim,c=i[0],s=i[i.length-1],u=[c];if(s-c){var h=_(s-c),f=Math.round(4-h),g=Math.pow(10,f),m=function(e,t,r){if(e.length<3)return e.slice(0);if(t<3)return[e[0],e[e.length-1]];var n,a=e[0]<0?Math.abs(e[0]):0,i=function(e){return e},o="sqrt"===r?function(e){return Math.sqrt(e+a)}:i,c="sqrt"===r?function(e){return Math.pow(e,2)-a}:i,s=[(e=e.map(o))[0]],u=e[e.length-1]-e[0],d=.5*u/(t-1),h=l.range(1,t-1).map((function(e){var r=u*e/(t-1);return{min:r-d,mid:r,max:r+d,diff:Number.MAX_VALUE,closest:null}})),_=0,f=function(){if(_!==h.length){var e=n;(n=h[_++]).min=Math.max(n.min,(e&&null!==e.closest?e.closest:s[0])+d)}};return f(),e.forEach((function(e){if(!(e<n.min)){e>n.max&&f();var t=Math.abs(e-n.mid);t<n.diff&&t<d?(n.diff=t,n.closest=e):f(),0===t&&f()}})),h.forEach((function(e){null!==e.closest&&s.push(e.closest)})),s.push(e[e.length-1]),s=s.map(c)}(l.unique(e._chart.getDataSources({excludeFilter:["legend"]})[a.source].data.map((function(e){return e[a.dim]})).filter((function(e){return e>=c&&e<=s}))).sort((function(e,t){return e-t})),4,a.funcType);u=l.unique(m.map((function(e){return Math.round(e*g)/g})))}var p=v(u[0],u[u.length-1]),b=function(e){return 13*e.length*.618};u.reverse();var y=u.map(a),x=Math.max.apply(null,y),S=u.map(p);e._container.insertAdjacentHTML("beforeend",e._template({name:l.escape(o),top:null,items:'<div class="tau-chart__legend__size-wrapper"></div>'}));var w=e._container.lastElementChild.querySelector(".tau-chart__legend__size-wrapper"),M=w.getBoundingClientRect().width,T=!1;(Math.max.apply(null,S.map(b))>M/4||1===S.length)&&(T=!0);var C=T?function(){for(var e=y[0]/2,t=y[y.length-1]/2,r=[e],n=1,a=void 0,i=void 0;n<y.length;n++)i=y[n-1]/2,a=y[n]/2,r.push(r[n-1]+Math.max(13*1.618,i+13+a));return{width:M,height:r[r.length-1]+Math.max(t,6.5),circleX:l.range(y.length).map((function(){return x/2})),circleY:r,textAnchor:"start",textX:l.range(S.length).map((function(){return x+8})),textY:r.map((function(e){return e+4.017}))}}():function(){for(var e=Math.max(b(S[0])/2,y[0]/2),t=Math.max(b(S[S.length-1])/2,y[y.length-1]/2),r=(M-y.reduce((function(e,t,r){return e+(0===r||r===y.length-1?t/2:t)}),0)-e-t)/3,n=[e],a=1,i=void 0,o=void 0;a<y.length;a++)o=y[a-1]/2,i=y[a]/2,n.push(n[a-1]+o+r+i);var c=y.map((function(e){return x-e/2}));return{width:M,height:x+8+13,circleX:n,circleY:c,textAnchor:"middle",textX:n,textY:l.range(S.length).map((function(){return x+8+13}))}}(),L=d.apply(void 0,["svg",{class:"tau-chart__legend__size",width:C.width,height:C.height}].concat(y.map((function(e,t){return d("circle",{class:"tau-chart__legend__size__item__circle "+(r.config.color?"color-definite":"color-default-size"),cx:C.circleX[t],cy:C.circleY[t],r:e/2})})),S.map((function(e,t){return d("text",{class:"tau-chart__legend__size__item__label",x:C.textX[t],y:C.textY[t],"text-anchor":C.textAnchor},e)}))));w.insertAdjacentHTML("beforeend",L)}}))},_getLegendColorByScales:function(){var e=this;return e._color.reduce((function(t,r){var i=e._chart.select((function(e){return e.config.color===r}))[0];if(i){var o=i.config.guide||{},c=i.getScale("color"),s=e._chart.getDataSources({excludeFilter:["legend"]}),u=l.unique(s[c.source].data.map((function(e){return e[c.dim]}))),d=e._chart.getSpec().scales[r],h=a(u);if(d.order)u=l.union(l.intersection(d.order,u),u);else if("order"===d.dimType&&h)u=u.sort((function(e,t){return new Date(e)-new Date(t)}));else{var _=e._legendOrderState[r];u=u.sort((function(e,t){var r=_[e]-_[t];return r&&r/Math.abs(r)}))}var f=((o.color||{}).label||{}).text||c.dim,g=(o.color||{}).tickFormatNullAlias||"No "+f,m=e._getFormat(c.dim),p=u.map((function(t){var a=JSON.stringify(n(t)?null:t),i=c.dim+a;return{scaleId:r,dim:c.dim,color:c(t),disabled:e._currentFilters.hasOwnProperty(i),label:m(t),value:a}}));t[r]={legendColorItems:p,title:f,colorScale:c,noVal:g}}return t}),{})},_drawColorLegend:function(){var e=this,t=this._getLegendColorByScales();Object.keys(t).forEach((function(r){var a=t[r],i=a.legendColorItems,o=a.title,c=a.colorScale,s=a.noVal;e._container.insertAdjacentHTML("beforeend",e._template({name:l.escape(o),top:e._resetTemplate({classDisabled:i.some((function(e){return e.disabled}))?"":"disabled"}),items:i.map((function(t){return e._itemTemplate({scaleId:t.scaleId,dim:l.escape(t.dim),color:t.color,cssClass:c.toClass(t.color),cssColor:t.disabled?"transparent":c.toColor(t.color),borderColor:c.toColor(t.color),classDisabled:t.disabled?"disabled":"",label:l.escape(n(t.label)?s:t.label),value:l.escape(t.value)})})).join("")}))})),e._color.length>0&&(e._updateResetButtonPosition(),e._scrollTimeout=null,e._scrollListener=function(){var t=e._container.querySelector(".tau-chart__legend__reset");t.style.display="none",e._scrollTimeout&&clearTimeout(e._scrollTimeout),e._scrollTimeout=setTimeout((function(){e._updateResetButtonPosition(),t.style.display="",e._scrollTimeout=null}),250)},e._getScrollContainer().addEventListener("scroll",e._scrollListener))},_toggleLegendItem:function(e,t){var n=this,a=this._currentFilters,o=e?Array.prototype.filter.call(e.parentNode.childNodes,(function(e){return e.matches(".tau-chart__legend__item-color")})):null,c=function(e){var t=e.getAttribute("data-dim"),r=e.getAttribute("data-value");return{sid:e.getAttribute("data-scale-id"),dim:t,val:r,key:t+r}},l=function(e){return e in a},s=function(e,t){var r=c(e);if(l(r.key)===t)if(t){var o=a[r.key];delete a[r.key],e.classList.remove("disabled"),n._chart.removeFilter(o)}else{e.classList.add("disabled");var s=i(r.dim,r.val);a[r.key]=n._chart.addFilter({tag:"legend",predicate:function(e){return!s(e)}})}},u=function(t){return t===e},d=!!e&&l(c(e).key),h=function(e,t){e.querySelector(".tau-chart__legend__guide").style.backgroundColor=t?"":"transparent"};if("reset"===t)o.forEach((function(e){s(e,!0),h(e,!0)}));else if("leave-others"===t)o.forEach((function(e){u(e)&&s(e,d)})),h(e,d);else if("focus-single"===t){var _=!d&&o.every((function(e){return u(e)||l(c(e).key)}));o.forEach((function(e){var t=u(e)||_;s(e,t)})),d&&h(e,!0)}var f=o.filter((function(e){return!l(c(e).key)})).map((function(e){return JSON.parse(c(e).val)}));r.onSelect({type:t,selectedCategories:f}),this._chart.refresh()},_highlightToggle:function(e,t){if(!e.matches(".disabled")){var r=e.getAttribute("data-dim"),n=e.getAttribute("data-value"),a=t?i(r,n):function(e){return null};this._chart.select((function(e){return!0})).forEach((function(e){e.fire("highlight",a)}))}},_getScrollContainer:function(){return this._container.parentNode.parentNode},_updateResetButtonPosition:function(){this._container.querySelector(".tau-chart__legend__reset").style.top=this._getScrollContainer().scrollTop+"px"},_generateColorMap:function(e,t){var r=t.length;return e.reduce((function(e,n,a){return e[n]=t[a%r],e}),{})},_assignStaticBrewersOrEx:function(){var e=this;e._color.forEach((function(t){var r=e._chart.getSpec().scales[t],n=e._chart.getDataSources({excludeFilter:["legend"]}),a=e._chart.getScaleFactory(n).createScaleInfoByName(t).domain();if(!r.brewer||Array.isArray(r.brewer)){var i=r.brewer||l.range(20).map((function(e){return"color20-"+(1+e)}));r.brewer=e._generateColorMap(a,i)}e._legendOrderState[t]=a.reduce((function(e,t,r){return e[t]=r,e}),{})}))}}}o.a.api.plugins.add("legend",b),t.default=b},9:function(e,r){e.exports=t}})}));