feat: support setting axis's position.

antvis · Jan 19, 2018 · 6a6a911 · 6a6a911
1 parent 91b5f0e
commit 6a6a911
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 45 deletions.
diff --git a/src/chart/assist/axis.js b/src/chart/assist/axis.js
@@ -41,26 +41,26 @@ class AxisAssist {
     return !axisCfg || axisCfg[field] === false;
   }
 
-  _getLinePosition(dimType, index) {
+  _getLinePosition(scale, dimType, index) {
     let position = '';
-    if (dimType === 'x') {
+    const field = scale.field;
+    const axisCfg = this.axisCfg;
+    if (axisCfg[field] && axisCfg[field].position) {
+      position = axisCfg[field].position;
+    } else if (dimType === 'x') {
       position = 'bottom';
+    } else if (dimType === 'y') {
+      position = index ? 'right' : 'left';
     }
-    if (dimType === 'y') {
-      if (index) {
-        position = 'right';
-      } else {
-        position = 'left';
-      }
-    }
+
     return position;
   }
 
-  _getLineCfg(coord, dimType, index) {
+  _getLineCfg(coord, position) {
     let start;
     let end;
     let factor = 1; // 文本的对齐方式，是顺时针方向还是逆时针方向
-    if (dimType === 'x') { // x轴的坐标轴,底部的横坐标
+    if (position === 'bottom') { // x轴的坐标轴,底部的横坐标
       start = {
         x: 0,
         y: 0
@@ -69,27 +69,25 @@ class AxisAssist {
         x: 1,
         y: 0
       };
-    } else { // y轴坐标轴
-      if (index) { // 多轴的情况
-        start = {
-          x: 1,
-          y: 0
-        };
-        end = {
-          x: 1,
-          y: 1
-        };
-      } else { // 单个y轴，或者第一个y轴
-        start = {
-          x: 0,
-          y: 0
-        };
-        end = {
-          x: 0,
-          y: 1
-        };
-        factor = -1;
-      }
+    } else if (position === 'right') { // 左侧 Y 轴
+      start = {
+        x: 1,
+        y: 0
+      };
+      end = {
+        x: 1,
+        y: 1
+      };
+    } else if (position === 'left') { // 右侧 Y 轴
+      start = {
+        x: 0,
+        y: 0
+      };
+      end = {
+        x: 0,
+        y: 1
+      };
+      factor = -1;
     }
     if (coord.transposed) {
       factor *= -1;
@@ -181,9 +179,9 @@ class AxisAssist {
     let appendCfg; // 跟特定坐标轴相关的配置项
     if (coordType === 'cartesian' || coordType === 'rect') { // 直角坐标系下
       C = Axis.Line;
-      const position = self._getLinePosition(dimType, index);
+      const position = self._getLinePosition(scale, dimType, index);
       defaultCfg = Global.axis[position];
-      appendCfg = self._getLineCfg(coord, dimType, index);
+      appendCfg = self._getLineCfg(coord, position);
     } else { // 极坐标系下
       if ((dimType === 'x' && !transposed) || (dimType === 'y' && transposed)) { // 圆形坐标轴
         C = Axis.Circle;

diff --git a/test/unit/chart/assist/axis-spec.js b/test/unit/chart/assist/axis-spec.js
@@ -53,7 +53,8 @@ describe('axis assist', function() {
     axisCfg: {
       c: false,
       b: {
-        grid: null
+        grid: null,
+        position: 'right'
       }
     }
   });
@@ -84,38 +85,38 @@ describe('axis assist', function() {
   });
 
   it('get line x axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'x');
+    const cfg = assist._getLineCfg(rect, 'bottom');
     expect(cfg.start).eql(rect.convertPoint({ x: 0, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 1, y: 0 }));
     expect(cfg.offsetFactor).equal(1);
   });
 
   it('get line y axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'y');
+    const cfg = assist._getLineCfg(rect, 'left');
     expect(cfg.start).eql(rect.convertPoint({ x: 0, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 0, y: 1 }));
     expect(cfg.offsetFactor).equal(-1);
   });
 
   it('get line y2 axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'y', 1);
+    const cfg = assist._getLineCfg(rect, 'right');
     expect(cfg.start).eql(rect.convertPoint({ x: 1, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 1, y: 1 }));
     expect(cfg.offsetFactor).equal(1);
   });
 
   it('get positin x', function() {
-    const positin = assist._getLinePosition('x');
+    const positin = assist._getLinePosition(otherLinear, 'x');
     expect(positin).equal('bottom');
   });
 
   it('get positin y', function() {
-    const positin = assist._getLinePosition('y');
-    expect(positin).equal('left');
+    const positin = assist._getLinePosition(linear, 'y');
+    expect(positin).equal('right');
   });
 
   it('get positin y 2', function() {
-    const positin = assist._getLinePosition('y', 1);
+    const positin = assist._getLinePosition(otherLinear, 'y', 1);
     expect(positin).equal('right');
   });
 
@@ -141,21 +142,21 @@ describe('axis assist rect transposed', function() {
   rect.transposed = true;
 
   it('get line x axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'x', { grid: {} });
+    const cfg = assist._getLineCfg(rect, 'bottom');
     expect(cfg.start).eql(rect.convertPoint({ x: 0, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 1, y: 0 }));
     expect(cfg.offsetFactor).equal(-1);
   });
 
   it('get line y axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'y');
+    const cfg = assist._getLineCfg(rect, 'left');
     expect(cfg.start).eql(rect.convertPoint({ x: 0, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 0, y: 1 }));
     expect(cfg.offsetFactor).equal(1);
   });
 
   it('get line y2 axis cfg', function() {
-    const cfg = assist._getLineCfg(rect, 'y', 1);
+    const cfg = assist._getLineCfg(rect, 'right');
     expect(cfg.start).eql(rect.convertPoint({ x: 1, y: 0 }));
     expect(cfg.end).eql(rect.convertPoint({ x: 1, y: 1 }));
     expect(cfg.offsetFactor).equal(-1);