apexcharts/dist/features/drilldown.common.js

A JavaScript Chart Library

/*!
 * ApexCharts v6.6.1
 * (c) 2018-2026 ApexCharts
 */
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("apexcharts/core");function e(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t)for(const i in t)if("default"!==i){const r=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,r.get?r:{enumerable:!0,get:()=>t[i]})}return e.default=t,Object.freeze(e)}const i=e(t),r=i.__apex_Utils,s=i.__apex_Environment_Environment,n=i.__apex_BrowserAPIs_BrowserAPIs,o="http://www.w3.org/1999/xhtml";class l{constructor(t,e,i){this.w=t,this.ctx=e,this.drilldown=i}render(t){if(!s.isBrowser())return;const e=this.w,i=e.dom.elWrap;if(!i)return;const r=i.querySelector(".apexcharts-breadcrumb");r&&r.parentNode&&r.parentNode.removeChild(r);const l=e.config.drilldown&&e.config.drilldown.breadcrumb;if(!l||!1===l.show)return;if(0===this.drilldown.depth)return;const a=n.createElementNS(o,"nav");a.setAttribute("class","apexcharts-breadcrumb"),a.setAttribute("aria-label","Drilldown breadcrumb"),this._position(a,l);const d=null!=l.separator?l.separator:" / ";t.forEach((e,i)=>{if(i>0){const t=n.createElementNS(o,"span");t.setAttribute("class","apexcharts-breadcrumb-separator"),t.setAttribute("aria-hidden","true"),t.textContent=d,a.appendChild(t)}const r=this._label(e,i);if(i===t.length-1){const t=n.createElementNS(o,"span");t.setAttribute("class","apexcharts-breadcrumb-item apexcharts-breadcrumb-current"),t.setAttribute("aria-current","page"),t.textContent=r,a.appendChild(t)}else{const t=n.createElementNS(o,"button");if(t.setAttribute("type","button"),t.setAttribute("class","apexcharts-breadcrumb-item"),0===i){const e=n.createElementNS(o,"span");e.setAttribute("class","apexcharts-breadcrumb-arrow"),e.setAttribute("aria-hidden","true"),e.textContent="\u2190",t.appendChild(e)}const e=n.createElementNS(o,"span");e.setAttribute("class","apexcharts-breadcrumb-label"),e.textContent=r,t.appendChild(e),t.addEventListener("click",()=>this.drilldown.drillToLevel(i)),a.appendChild(t)}}),i.appendChild(a)}_label(t,e){const i=this.w.config.drilldown.breadcrumb;let r;if(0===e)r=null!=i.rootLabel?i.rootLabel:"All";else{const e=(this.w.config.drilldown.series||[]).find(e=>e&&e.id===t);r=e&&e.name||String(t)}return"function"==typeof i.formatter?i.formatter(r,{index:e,depth:this.drilldown.depth}):r}_position(t,e){const i=e.offsetX||0,r=e.offsetY||0;t.style.position="absolute",t.style.top=r+"px","top-right"===e.position?t.style.right=3-i+"px":t.style.left=i+"px"}}t.registerFeatures({drilldown:class{constructor(t,e){this.w=t,this.ctx=e,this.stack=[],this.rootSnapshot=null,this._wired=!1,this.breadcrumb=new l(t,e,this),this._onPointSelect=this._onPointSelect.bind(this),this._afterRender=this._afterRender.bind(this),this.init()}init(){const t=this.w;t.config.drilldown&&t.config.drilldown.enabled&&(this._wired||(this._wired=!0,this.ctx.addEventListener("dataPointSelection",this._onPointSelect),this.ctx.addEventListener("mounted",this._afterRender),this.ctx.addEventListener("updated",this._afterRender)))}get path(){return["root",...this.stack.map(t=>t.id)]}get depth(){return this.stack.length}drillDown(t,e,i){const r=this._resolveChild(t);return r?this._drillInto(r,e,i):"function"==typeof this.w.config.drilldown.onDrillDown?this._drillDownAsync(t,e,i):Promise.resolve(this.ctx)}drillUp(){return this.drillToLevel(this.stack.length-1)}drillToRoot(){return this.drillToLevel(0)}drillToLevel(t){const e=this.stack.length;if(t<0||t>=e)return Promise.resolve(this.ctx);const i=this.path[this.path.length-1],r=0===t?this.rootSnapshot:this.stack[t].restore;this.stack=this.stack.slice(0,t);const s=this.path[this.path.length-1];return this._apply(this._viewFromSnapshot(r),"up",{from:i,to:s})}_resolveChild(t){const e=this.w.config.drilldown&&this.w.config.drilldown.series;return Array.isArray(e)&&e.find(e=>e&&e.id===t)||null}_drillInto(t,e,i){if(this.stack.length>=32)return Promise.resolve(this.ctx);this.rootSnapshot||(this.rootSnapshot=this._snapshot());const r=this.path[this.path.length-1];return this.stack.push({id:t.id,name:t.name,restore:this._snapshot()}),this._apply(this._viewFromChild(t),"down",{from:r,to:t.id,point:e,seriesIndex:i&&i.seriesIndex,dataPointIndex:i&&i.dataPointIndex})}_drillDownAsync(t,e,i){const r=this.w.config.drilldown.onDrillDown;let s;try{s=r({point:e,seriesIndex:i&&i.seriesIndex,dataPointIndex:i&&i.dataPointIndex})}catch(e){return this._fire("drillDownError",{id:t,error:e}),Promise.resolve(this.ctx)}return Promise.resolve(s).then(t=>t&&t.data?this._drillInto(t,e,i):this.ctx,e=>(this._fire("drillDownError",{id:t,error:e}),this.ctx))}_snapshot(){const t=this.w.config,e=this._overrideFields(),i={series:r.clone(t.series)};return Array.isArray(t.labels)&&t.labels.length&&(i.labels=r.clone(t.labels)),i.chart={type:t.chart.type,stacked:t.chart.stacked},e.has("xaxis")&&(i.xaxis=r.clone(t.xaxis)),e.has("yaxis")&&(i.yaxis=r.clone(t.yaxis)),e.has("colors")&&(i.colors=t.colors?r.clone(t.colors):void 0),e.has("plotOptions")&&(i.plotOptions=r.clone(t.plotOptions)),e.has("fill")&&(i.fill=r.clone(t.fill)),e.has("legend")&&(i.legend=r.clone(t.legend)),i}_overrideFields(){const t=new Set,e=this.w.config.drilldown&&this.w.config.drilldown.series||[];for(const i of e)i&&(i.xaxis&&t.add("xaxis"),i.yaxis&&t.add("yaxis"),i.colors&&t.add("colors"),i.plotOptions&&t.add("plotOptions"),i.fill&&t.add("fill"),i.legend&&t.add("legend"));return t}_viewFromChild(t){const e={};Array.isArray(t.series)?e.series=t.series:e.series=[{name:t.name||"",data:t.data}];const i={};return t.chart&&t.chart.type&&(i.type=t.chart.type),t.chart&&null!=t.chart.stacked&&(i.stacked=t.chart.stacked),Object.keys(i).length&&(e.chart=i),t.xaxis&&(e.xaxis=t.xaxis),t.yaxis&&(e.yaxis=t.yaxis),t.colors&&(e.colors=t.colors),t.plotOptions&&(e.plotOptions=t.plotOptions),t.fill&&(e.fill=t.fill),t.legend&&(e.legend=t.legend),e}_viewFromSnapshot(t){const e={series:t.series,chart:t.chart};return t.labels&&t.labels.length&&(e.labels=t.labels),t.xaxis&&(e.xaxis=t.xaxis),t.yaxis&&(e.yaxis=t.yaxis),t.colors&&(e.colors=t.colors),t.plotOptions&&(e.plotOptions=t.plotOptions),t.fill&&(e.fill=t.fill),t.legend&&(e.legend=t.legend),e}_apply(t,e,i){const r=this.w;r.interact.selectedDataPoints=[],r.globals.collapsedSeries=[],r.globals.collapsedSeriesIndices=[],r.globals.ancillaryCollapsedSeries=[],r.globals.ancillaryCollapsedSeriesIndices=[],r.globals.allSeriesCollapsed=!1,r.globals.risingSeries=[];const s=(!r.config.drilldown.animation||!1!==r.config.drilldown.animation.enabled)&&!1!==r.config.chart.animations.enabled;"down"===e&&this._fire("drillDownStart",i);const n=e=>this.ctx.updateOptions(t,!1,e,!1,!1),o=()=>(this._fire("down"===e?"drillDownEnd":"drillUp",i),this.ctx);if(s&&this._zoomEnabled()){const t=this._triggerOrigin(i);if(t)return this._zoomDrill(t,e,()=>n(!1)).then(o)}return n(s).then(o)}_zoomEnabled(){const t=this.w.config.drilldown&&this.w.config.drilldown.animation;return!(!t||!t.zoomFromPoint)}_svgNode(){const t=this.w.dom&&this.w.dom.Paper;return t&&t.node?t.node:null}_markGroup(){const t=this._svgNode();return t&&"function"==typeof t.querySelector?t.querySelector(".apexcharts-plot-series, .apexcharts-heatmap, .apexcharts-treemap"):null}_triggerOrigin(t){if(!s.isBrowser())return null;const e=this._svgNode(),i=this._markGroup();if(!e||!i||"function"!=typeof i.animate||"function"!=typeof e.getBoundingClientRect)return null;const r=e.getBoundingClientRect();let n=null;if(t&&null!=t.seriesIndex&&null!=t.dataPointIndex&&this.w.dom.baseEl&&(n=this.w.dom.baseEl.querySelector(`[index="${t.seriesIndex}"][j="${t.dataPointIndex}"]`)),n&&"function"==typeof n.getBoundingClientRect){const t=n.getBoundingClientRect();return{x:t.left+t.width/2-r.left,y:t.top+t.height/2-r.top}}const o=i.getBoundingClientRect();return{x:o.left+o.width/2-r.left,y:o.top+o.height/2-r.top}}_zoomDrill(t,e,i){return r=this,s=null,n=function*(){const r=this._zoomDuration(),s="down"===e,n=Math.round(.55*r),o=s?"scale(1.03)":"scale(0.97)",l=s?"scaleX(0.55) scaleY(0.85)":"scale(1.04)",a=e=>{e.style.transformBox="view-box",e.style.transformOrigin=`${t.x}px ${t.y}px`},d=this._markGroup();let c=null;if(d){a(d),c=d.animate([{transform:"scale(1)",opacity:1},{transform:o,opacity:0}],{duration:n,easing:"ease-in",fill:"forwards"});try{yield c.finished}catch(t){}}yield i();const h=this._markGroup();if(h){a(h),h.style.opacity="0",h.style.transform=l,c&&d===h&&c.cancel();const t=h.animate([{transform:l,opacity:0},{transform:"scale(1)",opacity:1}],{duration:r,easing:"cubic-bezier(0.16, 1, 0.3, 1)",fill:"forwards"});try{yield t.finished}catch(t){}(p=h).style.transform="",p.style.opacity="",p.style.transformOrigin="",p.style.transformBox="",t.cancel()}var p},new Promise((t,e)=>{var i=t=>{try{l(n.next(t))}catch(t){e(t)}},o=t=>{try{l(n.throw(t))}catch(t){e(t)}},l=e=>e.done?t(e.value):Promise.resolve(e.value).then(i,o);l((n=n.apply(r,s)).next())});var r,s,n}_zoomDuration(){const t=this.w.config.drilldown&&this.w.config.drilldown.animation,e=t&&"number"==typeof t.speed?t.speed:260;return Math.max(80,e)}_fire(t,e){const i=this.w.config.chart.events&&this.w.config.chart.events[t];"function"==typeof i&&i(e,this.ctx,this.w),this.ctx.events.fireEvent(t,[e,this.ctx,this.w])}_onPointSelect(t,e,i){if(!i)return;const r=this._pointAt(i.seriesIndex,i.dataPointIndex);return r&&"object"==typeof r&&null!=r.drilldown?this.drillDown(r.drilldown,r,i):"function"==typeof this.w.config.drilldown.onDrillDown?this._drillDownAsync(null,r,i):void 0}_pointAt(t,e){const i=this.w.config.series;if(!Array.isArray(i)||null==t||null==e)return null;const r=i[t];return r&&Array.isArray(r.data)&&null!=r.data[e]?r.data[e]:null}_afterRender(){this.w.config.drilldown&&this.w.config.drilldown.enabled&&(this._markDrillableTargets(),this.breadcrumb.render(this.path))}_markDrillableTargets(){if(!s.isBrowser())return;const t=this.w,e=t.dom.baseEl,i=t.config.series;e&&Array.isArray(i)&&i.forEach((t,i)=>{const r=t&&Array.isArray(t.data)?t.data:null;r&&r.forEach((t,r)=>{if(!t||"object"!=typeof t||null==t.drilldown)return;e.querySelectorAll(`[index="${i}"][j="${r}"]`).forEach(t=>t.classList.add("apexcharts-drilldown-target"))})})}}}),exports.default=t;