fix(treemap): Fix missing element arg on data.onover/out

Pass element argument for data.onover/out callback

Fix #3766

src/ChartInternal/interactions/interaction.ts

@@ -4,7 +4,7 @@
  */
 import {drag as d3Drag} from "d3-drag";
 import {select as d3Select} from "d3-selection";
-import {$ARC, $AXIS, $COMMON, $SHAPE, $TREEMAP} from "../../config/classes";
+import {$ARC, $AXIS, $COMMON, $SHAPE} from "../../config/classes";
 import {KEY} from "../../module/Cache";
 import {emulateEvent, getPointer, isNumber, isObject} from "../../module/util";
 import type {IArcDataRow} from "../data/IData";
@@ -65,11 +65,12 @@ export default {
 			config.color_onover && $$.setOverColor(isOver, d, isArcTreemap);
 
 			if (isArcTreemap && "id") {
-				const selector = hasTreemap ? $TREEMAP.treemap : $ARC.arc;
+				const suffix = $$.getTargetSelectorSuffix((d as IArcDataRow).id);
+				const selector = hasTreemap ?
+					`${$COMMON.target + suffix} .${$SHAPE.shape}` :
+					$ARC.arc + suffix;
 
-				callback(d,
-					main.select(`.${selector}${$$.getTargetSelectorSuffix((d as IArcDataRow).id)}`)
-						.node());
+				callback(d, main.select(`.${selector}`).node());
 			} else if (!config.tooltip_grouped) {
 				const last = $$.cache.get(KEY.setOverOut) || [];
 

src/ChartInternal/shape/treemap.ts

@@ -214,6 +214,7 @@ export default {
 		const {$el, $T} = $$;
 		const data = $el.treemap.datum();
 		const classChartTreemap = $$.getChartClass("Treemap");
+		const classTreemap = $$.getClass("treemap", true);
 
 		const treemap = $el.treemap
 			.selectAll("g")
@@ -230,6 +231,8 @@ export default {
 		$el.treemap.selectAll("g")
 			.attr("class", classChartTreemap)
 			.select("rect")
+			.attr("class", classTreemap)
+			.attr("fill", d => $$.color(d.data.name))
 			.attr("fill", d => $$.color(d.data.name));
 	},
 

src/config/Options/axis/x.ts

@@ -51,7 +51,7 @@ export default {
 	 *   x: {
 	 *      // will work as single x axis
 	 *      forceAsSingle: true
-	 *   } 
+	 *   }
 	 * }
 	 */
 	axis_x_forceAsSingle: false,

test/shape/treemap-spec.ts

@@ -5,6 +5,7 @@
 /* eslint-disable */
 /* global describe, beforeEach, it, expect */
 import {expect} from "chai";
+import sinon from "sinon";
 import util from "../assets/util";
 import {parseNum} from "../assets/helper";
 
@@ -279,4 +280,46 @@ describe("TREEMAP", () => {
 			expect(chart.$.tooltip.select(".name").text()).to.be.equal(id);
 		});
 	});
+
+	describe("data.onover/out", () => {
+		let overSpy = sinon.spy();
+		let outSpy = sinon.spy();
+
+		before(() => {
+			args = {
+				data: {
+					columns: [
+						["data1", 130],
+						["data2", 200],
+						["data3", 500]
+					],
+					type: "treemap",
+					onover: overSpy,
+					onout: outSpy
+				}
+			}
+		});
+
+		it("should argument passed correctly", () => {
+			const id = "data1";
+
+			// when
+			chart.tooltip.show({data: {id}});
+
+			expect(overSpy.called).to.be.true;
+			let [data, element] = overSpy.args[0];
+
+			expect(data.id === id).to.be.true;
+			expect(element.tagName).to.be.equal("rect");
+
+			// when
+			chart.tooltip.hide();
+			[data, element] = overSpy.args[0];
+
+			expect(outSpy.called).to.be.true;
+
+			expect(data.id === id).to.be.true;
+			expect(element.tagName).to.be.equal("rect");
+		});
+	});
 });