diff --git a/src/views/reports/components/items-per-term-collection-block.vue b/src/views/reports/components/items-per-term-collection-block.vue
index d2d67eda6..4e5ef330a 100644
--- a/src/views/reports/components/items-per-term-collection-block.vue
+++ b/src/views/reports/components/items-per-term-collection-block.vue
@@ -144,7 +144,8 @@
                             v-if="!isFetchingData && !isBuildingChart && !isFetchingMetadatumTerms && selectedMetadatum && selectedMetadatum.id"
                             height="380px"
                             :series="chartSeries"
-                            :options="chartOptions" />
+                            :options="chartOptions"
+                            @data-point-selection="handleDataPointClick" />
                     <button 
                             v-if=" !isFetchingData && !isFetchingMetadatumTerms && selectedMetadatum"
                             class="button-secondary hide-column-button"
@@ -243,7 +244,8 @@
                                 v-if="!isBuildingChildrenChart && !isFetchingMetadatumChildTerms"
                                 height="380px"
                                 :series="childrenChartSeries"
-                                :options="childrenChartOptions" />
+                                :options="childrenChartOptions"
+                                @data-point-selection="handleDataPointClickChildren" />
                     </div>
                     <div 
                             v-else
@@ -333,7 +335,9 @@ export default {
             maxChildTermsToDisplay: 56,
             childTermsDisplayedPage: 1,
             isChildColumnCollapsed: false,
-            itemsPerTermChartMode: 'bar'
+            itemsPerTermChartMode: 'bar',
+            orderedTerms: [],
+            orderedChildTerms: []
         }
     },
     computed: {
@@ -416,18 +420,86 @@ export default {
             'setTaxonomyTerms',
             'setReportLatestCachedOn'
         ]),
+        handleDataPointClick(event, chartContext, config) {
+            if ( this.itemsPerTermChartMode == 'treemap' ) {
+                if (config.dataPointIndex >= 0 && this.orderedTerms[config.dataPointIndex]) {
+                    const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == this.orderedTerms[config.dataPointIndex].value);
+                    if (existingParentTermIndex < 0) {
+                        this.selectedParentTerm.push({
+                            id: this.orderedTerms[config.dataPointIndex].value,
+                            label: this.orderedTerms[config.dataPointIndex].label
+                        })
+                    }
+                }
+            } else {
+                if (config.dataPointIndex >= 0 && this.orderedTerms[config.dataPointIndex]) {
+                    const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == this.orderedTerms[config.dataPointIndex].value);
+                    if (existingParentTermIndex < 0) {
+                        // Removes siblings from the hierarchy, if existing
+                        if (this.selectedParentTerm.length && (this.selectedParentTerm[this.selectedParentTerm.length - 1].id != this.orderedTerms[config.dataPointIndex].parent) )
+                            this.selectedParentTerm.pop();
+
+                        this.selectedParentTerm.push({
+                            id: this.orderedTerms[config.dataPointIndex].value,
+                            label: this.orderedTerms[config.dataPointIndex].label
+                        });
+                    }
+                }
+            }
+        },
+        handleDataPointClickChildren(event, chartContext, config) {
+            if ( this.itemsPerTermChartMode == 'treemap' ) {
+                if (config.dataPointIndex >= 0 && this.orderedChildTerms[config.dataPointIndex]) {
+                    const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == this.orderedChildTerms[config.dataPointIndex].value);
+                    if (existingParentTermIndex < 0) {
+
+                        // Removes siblings from the hierarchy, if existing
+                        if (this.selectedParentTerm.length && (this.selectedParentTerm[this.selectedParentTerm.length - 1].id != this.orderedChildTerms[config.dataPointIndex].parent) )
+                            this.selectedParentTerm.pop();
+
+                        const previousMetadatumChildTermsLatestCachedOn = this.metadatumChildTermsLatestCachedOn ? this.metadatumChildTermsLatestCachedOn.replace('-is-child-chart', '') : '';
+                        this.selectedParentTerm.push({
+                            id: this.orderedChildTerms[config.dataPointIndex].value,
+                            label: this.orderedChildTerms[config.dataPointIndex].label
+                        });
+                        
+                        this.setTaxonomyTerms(this.taxonomyChildTerms);
+                        this.setReportLatestCachedOn({
+                            report: 'taxonomy-terms-' + (this.collectionId ? this.collectionId : 'default') + '-' + this.selectedMetadatum.id + (this.selectedParentTerm.length > 2 && this.selectedParentTerm[this.selectedParentTerm.length - 2] && this.selectedParentTerm[this.selectedParentTerm.length - 2].id ? '-' + this.selectedParentTerm[this.selectedParentTerm.length - 1].id : ''),
+                            reportLatestCachedOn: previousMetadatumChildTermsLatestCachedOn
+                        });
+                        this.buildMetadatumTermsChart();
+                    }
+                }
+            } else {
+                if (config.dataPointIndex >= 0 && this.orderedChildTerms[config.dataPointIndex]) {
+                    const previousMetadatumChildTermsLatestCachedOn = this.metadatumChildTermsLatestCachedOn ? this.metadatumChildTermsLatestCachedOn.replace('-is-child-chart', '') : '';
+                    this.selectedParentTerm.push({
+                        id: this.orderedChildTerms[config.dataPointIndex].value,
+                        label: this.orderedChildTerms[config.dataPointIndex].label
+                    });
+                    
+                    this.setTaxonomyTerms(this.taxonomyChildTerms);
+                    this.setReportLatestCachedOn({
+                        report: 'taxonomy-terms-' + (this.collectionId ? this.collectionId : 'default') + '-' + this.selectedMetadatum.id + (this.selectedParentTerm.length > 2 && this.selectedParentTerm[this.selectedParentTerm.length - 2] && this.selectedParentTerm[this.selectedParentTerm.length - 2].id ? '-' + this.selectedParentTerm[this.selectedParentTerm.length - 1].id : ''),
+                        reportLatestCachedOn: previousMetadatumChildTermsLatestCachedOn
+                    });
+                    this.buildMetadatumTermsChart();
+                }
+            }
+        },
         buildMetadatumTermsChart() {
             this.isBuildingChart = true;
             
             // Building Taxonomy term usage chart
-            let orderedTerms = JSON.parse(JSON.stringify(this.taxonomyTerms)).sort((a, b) => b.total_items - a.total_items );
-            orderedTerms = orderedTerms.slice((this.termsDisplayedPage - 1) * this.maxTermsToDisplay, ((this.termsDisplayedPage - 1) * this.maxTermsToDisplay) + this.maxTermsToDisplay);
+            let preOrderedTerms = JSON.parse(JSON.stringify(this.taxonomyTerms)).sort((a, b) => b.total_items - a.total_items );
+            this.orderedTerms = preOrderedTerms.slice((this.termsDisplayedPage - 1) * this.maxTermsToDisplay, ((this.termsDisplayedPage - 1) * this.maxTermsToDisplay) + this.maxTermsToDisplay);
             
             if (this.itemsPerTermChartMode == 'treemap') {
                 this.chartSeries = [
                     {
                         name: this.$i18n.get('label_items_per_term'),
-                        data: orderedTerms.map((aTerm) => { return { 
+                        data: this.orderedTerms.map((aTerm) => { return { 
                             x: aTerm.label,
                             y: aTerm.total_items
                         } })
@@ -445,20 +517,7 @@ export default {
                             },
                             zoom: {
                                 enabled: false
-                            },
-                            events: {
-                                dataPointSelection: (event, chartContext, config) => {
-                                    if (config.dataPointIndex >= 0 && orderedTerms[config.dataPointIndex]) {
-                                        const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == orderedTerms[config.dataPointIndex].value);
-                                        if (existingParentTermIndex < 0) {
-                                            this.selectedParentTerm.push({
-                                                id: orderedTerms[config.dataPointIndex].value,
-                                                label: orderedTerms[config.dataPointIndex].label
-                                            })
-                                        }
-                                    }
-                                }
-                            },
+                            }
                         },
                         dataLabels: {
                             enabled: true,
@@ -473,11 +532,11 @@ export default {
                         tooltip: {
                             custom: ({ dataPointIndex }) => {
                                 return `<div class="tainacan-custom-tooltip">
-                                        <div class="tainacan-custom-tooltip__header">` + orderedTerms[dataPointIndex].label + `</div>
+                                        <div class="tainacan-custom-tooltip__header">` + this.orderedTerms[dataPointIndex].label + `</div>
                                         <div class="tainacan-custom-tooltip__body">
-                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + orderedTerms[dataPointIndex].total_items + `</strong></span>
-                                            `+ (orderedTerms[dataPointIndex].total_children 
-                                                ? (`<span>` + this.$i18n.getWithVariables(orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
+                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + this.orderedTerms[dataPointIndex].total_items + `</strong></span>
+                                            `+ (this.orderedTerms[dataPointIndex].total_children 
+                                                ? (`<span>` + this.$i18n.getWithVariables(this.orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ this.orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
                                                 : ``
                                             ) +
                                         `</div></div>`;
@@ -493,7 +552,7 @@ export default {
                 let termsValues = [];
                 let termsLabels = [];
 
-                orderedTerms.forEach(term => {
+                this.orderedTerms.forEach(term => {
                     termsValues.push(term.total_items);
                     termsLabels.push(term.label);
                 });
@@ -529,33 +588,16 @@ export default {
                             zoom: {
                                 enabled: true,
                                 autoScaleYaxis: true,
-                            },
-                            events: {
-                                dataPointSelection: (event, chartContext, config) => {
-                                    if (config.dataPointIndex >= 0 && orderedTerms[config.dataPointIndex]) {
-                                        const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == orderedTerms[config.dataPointIndex].value);
-                                        if (existingParentTermIndex < 0) {
-                                            // Removes siblings from the hierarchy, if existing
-                                            if (this.selectedParentTerm.length && (this.selectedParentTerm[this.selectedParentTerm.length - 1].id != orderedTerms[config.dataPointIndex].parent) )
-                                                this.selectedParentTerm.pop();
-
-                                            this.selectedParentTerm.push({
-                                                id: orderedTerms[config.dataPointIndex].value,
-                                                label: orderedTerms[config.dataPointIndex].label
-                                            });
-                                        }
-                                    }
-                                }
-                            },
+                            }
                         },
                         tooltip: {
                             custom: ({ dataPointIndex }) => {
                                 return `<div class="tainacan-custom-tooltip">
-                                        <div class="tainacan-custom-tooltip__header">` + orderedTerms[dataPointIndex].label + `</div>
+                                        <div class="tainacan-custom-tooltip__header">` + this.orderedTerms[dataPointIndex].label + `</div>
                                         <div class="tainacan-custom-tooltip__body">
-                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + orderedTerms[dataPointIndex].total_items + `</strong></span>
-                                            `+ (orderedTerms[dataPointIndex].total_children 
-                                                ? (`<span>` + this.$i18n.getWithVariables(orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
+                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + this.orderedTerms[dataPointIndex].total_items + `</strong></span>
+                                            `+ (this.orderedTerms[dataPointIndex].total_children 
+                                                ? (`<span>` + this.$i18n.getWithVariables(this.orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ this.orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
                                                 : ``
                                             ) +
                                         `</div></div>`;
@@ -567,7 +609,7 @@ export default {
                             }
                         },
                         animations: {
-                            enabled: orderedTerms.length <= 40
+                            enabled: this.orderedTerms.length <= 40
                         },
                         noData: {
                             text: '0 ' + this.$i18n.get('label_items_with_this_metadatum_value')
@@ -583,14 +625,14 @@ export default {
             this.isBuildingChildrenChart = true;
             
             // Building Taxonomy term usage chart
-            let orderedTerms = JSON.parse(JSON.stringify(this.taxonomyChildTerms)).sort((a, b) => b.total_items - a.total_items );
-            orderedTerms = orderedTerms.slice((this.termsDisplayedPage - 1) * this.maxTermsToDisplay, ((this.termsDisplayedPage - 1) * this.maxTermsToDisplay) + this.maxTermsToDisplay);
+            let preOrderedTerms = JSON.parse(JSON.stringify(this.taxonomyChildTerms)).sort((a, b) => b.total_items - a.total_items );
+            this.orderedChildTerms = preOrderedTerms.slice((this.termsDisplayedPage - 1) * this.maxTermsToDisplay, ((this.termsDisplayedPage - 1) * this.maxTermsToDisplay) + this.maxTermsToDisplay);
             
             if (this.itemsPerTermChartMode == 'treemap') {
                 this.childrenChartSeries = [
                     {
                         name: this.$i18n.get('label_items_per_term'),
-                        data: orderedTerms.map((aTerm) => { return { 
+                        data: this.orderedChildTerms.map((aTerm) => { return { 
                             x: aTerm.label,
                             y: aTerm.total_items
                         } })
@@ -608,33 +650,7 @@ export default {
                             },
                             zoom: {
                                 enabled: false
-                            },
-                            events: {
-                                dataPointSelection: (event, chartContext, config) => {
-                                    if (config.dataPointIndex >= 0 && orderedTerms[config.dataPointIndex]) {
-                                        const existingParentTermIndex = this.selectedParentTerm.findIndex((term) => term.id == orderedTerms[config.dataPointIndex].value);
-                                        if (existingParentTermIndex < 0) {
-
-                                            // Removes siblings from the hierarchy, if existing
-                                            if (this.selectedParentTerm.length && (this.selectedParentTerm[this.selectedParentTerm.length - 1].id != orderedTerms[config.dataPointIndex].parent) )
-                                                this.selectedParentTerm.pop();
-
-                                            const previousMetadatumChildTermsLatestCachedOn = this.metadatumChildTermsLatestCachedOn ? this.metadatumChildTermsLatestCachedOn.replace('-is-child-chart', '') : '';
-                                            this.selectedParentTerm.push({
-                                                id: orderedTerms[config.dataPointIndex].value,
-                                                label: orderedTerms[config.dataPointIndex].label
-                                            });
-                                            
-                                            this.setTaxonomyTerms(this.taxonomyChildTerms);
-                                            this.setReportLatestCachedOn({
-                                                report: 'taxonomy-terms-' + (this.collectionId ? this.collectionId : 'default') + '-' + this.selectedMetadatum.id + (this.selectedParentTerm.length > 2 && this.selectedParentTerm[this.selectedParentTerm.length - 2] && this.selectedParentTerm[this.selectedParentTerm.length - 2].id ? '-' + this.selectedParentTerm[this.selectedParentTerm.length - 1].id : ''),
-                                                reportLatestCachedOn: previousMetadatumChildTermsLatestCachedOn
-                                            });
-                                            this.buildMetadatumTermsChart();
-                                        }
-                                    }
-                                }
-                            },
+                            }
                         },
                         dataLabels: {
                             enabled: true,
@@ -649,11 +665,11 @@ export default {
                         tooltip: {
                              custom: ({ dataPointIndex }) => {
                                 return `<div class="tainacan-custom-tooltip">
-                                        <div class="tainacan-custom-tooltip__header">` + orderedTerms[dataPointIndex].label + `</div>
+                                        <div class="tainacan-custom-tooltip__header">` + this.orderedChildTerms[dataPointIndex].label + `</div>
                                         <div class="tainacan-custom-tooltip__body">
-                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + orderedTerms[dataPointIndex].total_items + `</strong></span>
-                                            `+ (orderedTerms[dataPointIndex].total_children 
-                                                ? (`<span>` + this.$i18n.getWithVariables(orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
+                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + this.orderedChildTerms[dataPointIndex].total_items + `</strong></span>
+                                            `+ (this.orderedChildTerms[dataPointIndex].total_children 
+                                                ? (`<span>` + this.$i18n.getWithVariables(this.orderedChildTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ this.orderedChildTerms[dataPointIndex].total_children ]) + `</span>`) 
                                                 : ``
                                             ) +
                                         `</div></div>`;
@@ -669,7 +685,7 @@ export default {
                 let termsValues = [];
                 let termsLabels = [];
 
-                orderedTerms.forEach(term => {
+                this.orderedChildTerms.forEach(term => {
                     termsValues.push(term.total_items);
                     termsLabels.push(term.label);
                 });
@@ -705,25 +721,7 @@ export default {
                             zoom: {
                                 enabled: true,
                                 autoScaleYaxis: true,
-                            },
-                            events: {
-                                dataPointSelection: (event, chartContext, config) => {
-                                    if (config.dataPointIndex >= 0 && orderedTerms[config.dataPointIndex]) {
-                                        const previousMetadatumChildTermsLatestCachedOn = this.metadatumChildTermsLatestCachedOn ? this.metadatumChildTermsLatestCachedOn.replace('-is-child-chart', '') : '';
-                                        this.selectedParentTerm.push({
-                                            id: orderedTerms[config.dataPointIndex].value,
-                                            label: orderedTerms[config.dataPointIndex].label
-                                        });
-                                        
-                                        this.setTaxonomyTerms(this.taxonomyChildTerms);
-                                        this.setReportLatestCachedOn({
-                                            report: 'taxonomy-terms-' + (this.collectionId ? this.collectionId : 'default') + '-' + this.selectedMetadatum.id + (this.selectedParentTerm.length > 2 && this.selectedParentTerm[this.selectedParentTerm.length - 2] && this.selectedParentTerm[this.selectedParentTerm.length - 2].id ? '-' + this.selectedParentTerm[this.selectedParentTerm.length - 1].id : ''),
-                                            reportLatestCachedOn: previousMetadatumChildTermsLatestCachedOn
-                                        });
-                                        this.buildMetadatumTermsChart();
-                                    }
-                                }
-                            },
+                            }
                         },
                         yaxis: {
                             title: {
@@ -733,18 +731,18 @@ export default {
                         tooltip: {
                             custom: ({ dataPointIndex }) => {
                                 return `<div class="tainacan-custom-tooltip">
-                                        <div class="tainacan-custom-tooltip__header">` + orderedTerms[dataPointIndex].label + `</div>
+                                        <div class="tainacan-custom-tooltip__header">` + this.orderedChildTerms[dataPointIndex].label + `</div>
                                         <div class="tainacan-custom-tooltip__body">
-                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + orderedTerms[dataPointIndex].total_items + `</strong></span>
-                                            `+ (orderedTerms[dataPointIndex].total_children 
-                                                ? (`<span>` + this.$i18n.getWithVariables(orderedTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ orderedTerms[dataPointIndex].total_children ]) + `</span>`) 
+                                            <span>` + this.$i18n.get('label_items_per_term') + `: <strong>` + this.orderedChildTerms[dataPointIndex].total_items + `</strong></span>
+                                            `+ (this.orderedChildTerms[dataPointIndex].total_children 
+                                                ? (`<span>` + this.$i18n.getWithVariables(this.orderedChildTerms[dataPointIndex].total_children > 1 ? 'instruction_click_to_see_%s_child_terms' : 'instruction_click_to_see_%s_child_term', [ this.orderedChildTerms[dataPointIndex].total_children ]) + `</span>`) 
                                                 : ``
                                             ) +
                                         `</div></div>`;
                             }
                         },
                         animations: {
-                            enabled: orderedTerms.length <= 40
+                            enabled: this.orderedChildTerms.length <= 40
                         },
                         noData: {
                             text: this.$i18n.get('label_items_with_this_metadatum_value')