fix(subchart): Maintaion selection for category x axis

Use org domain/scale to maintain subchart selection on resize Fix #778
naver · Mar 6, 2019 · 3f46609 · 3f46609
1 parent 9cda54f
commit 3f46609
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 15 deletions.
diff --git a/spec/interactions/subchart-spec.js b/spec/interactions/subchart-spec.js
@@ -16,7 +16,7 @@ describe("SUBCHART", () => {
 		chart = util.generate(args);
 	});
 
-	describe("generate sbuchart", () => {
+	describe("generate subchart", () => {
 		before(() => {
 			args = {
 				data: {
@@ -134,7 +134,7 @@ describe("SUBCHART", () => {
 		})
 	});
 
-	describe("generate sbuchart", () => {
+	describe("subchart selection", () => {
 		before(() => {
 			args = {
 				data: {
@@ -148,26 +148,25 @@ describe("SUBCHART", () => {
 			};
 		});
 
-
-		it("should be select subchart area", done => {
+		const checkSelection = done => {
 			const selection = chart.$.svg.select(".selection");
 			const overlay = chart.$.svg.select(".overlay").node();
 			const baseWidth = 100;
 
 			// do mouse selection
 			util.fireEvent(overlay, "mousedown", {
-				clientX: 50,
-				clientY: 50
+				clientX: 100,
+				clientY: 100
 			}, chart);
 
 			util.fireEvent(overlay, "mousemove", {
-				clientX: 150,
-				clientY: 150
+				clientX: 200,
+				clientY: 200
 			}, chart);
 
 			util.fireEvent(overlay, "mouseup", {
-				clientX: 150,
-				clientY: 150
+				clientX: 200,
+				clientY: 200
 			}, chart);
 
 			expect(+selection.attr("width")).to.be.equal(baseWidth);
@@ -181,6 +180,19 @@ describe("SUBCHART", () => {
 				expect(chart.internal.x.domain()).to.not.deep.equal(chart.internal.orgXDomain);
 				done();
 			}, 300);
-		})
+		};
+
+		it("should be select subchart area", checkSelection);
+
+		it("set options axis.x.type='category'", () => {
+			args.axis = {
+				x: {
+					type: "category",
+					categories: ["cat1", "cat2", "cat3", "cat4", "cat5", "cat6"]
+				}
+			};
+		});
+
+		it("should be select subchart area for category type x axis", checkSelection);
 	});
 });
diff --git a/src/interactions/subchart.js b/src/interactions/subchart.js
@@ -43,7 +43,7 @@ extend(ChartInternal.prototype, {
 			})
 			.on("brush", brushHandler)
 			.on("end", () => {
-				lastDomain = $$.x.domain();
+				lastDomain = $$.x.orgDomain();
 			});
 
 		$$.brush.updateResize = function() {
@@ -52,7 +52,7 @@ extend(ChartInternal.prototype, {
 				const selection = this.getSelection();
 
 				lastDomain && d3BrushSelection(selection.node()) &&
-					this.move(selection, lastDomain.map($$.subX));
+					this.move(selection, lastDomain.map($$.subX.orgScale()));
 			}, 0);
 		};
 
@@ -377,7 +377,6 @@ extend(ChartInternal.prototype, {
 	 */
 	redrawForBrush() {
 		const $$ = this;
-		const x = $$.x;
 
 		$$.redraw({
 			withTransition: false,
@@ -387,7 +386,7 @@ extend(ChartInternal.prototype, {
 			withDimension: false
 		});
 
-		$$.config.subchart_onbrush.call($$.api, x.orgDomain());
+		$$.config.subchart_onbrush.call($$.api, $$.x.orgDomain());
 	},
 
 	/**