fix(facet): fixed bug of #361

src/chart/view.js

@@ -908,8 +908,8 @@ class View extends Base {
     this.clearInner();
     this.emit('beforerender');
     this.beforeRender();
-    this.drawComponents();
     this.emit('beforepaint');
+    this.drawComponents();
     this.paint();
     this.emit('afterpaint');
     this.drawCanvas(stopDraw);

src/facet/base.js

@@ -72,7 +72,7 @@ class Base {
         style: {
           fontSize: 14,
           textAlign: 'center',
-          fill: '#444',
+          fill: '#666',
           fontFamily: Global.fontFamily
         }
       },
@@ -82,7 +82,7 @@ class Base {
           fontSize: 14,
           textAlign: 'center',
           rotate: 90,
-          fill: '#444',
+          fill: '#666',
           fontFamily: Global.fontFamily
         }
       }

test/bugs/issue-361-spec.js

@@ -0,0 +1,43 @@
+// const expect = require('chai').expect;
+const G2 = require('../../index');
+const diamonds = require('../../demos/data/diamond.json');
+
+describe('#361', () => {
+  it('facet title error', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    const chart = new G2.Chart({
+      container: div,
+      width: 500,
+      height: 540
+    });
+
+    chart.source(diamonds, {
+      carat: {
+        sync: true
+      },
+      price: {
+        sync: true
+      },
+      cut: {
+        sync: true
+      }
+    });
+    chart.facet('list', {
+      fields: [ 'cut' ],
+      cols: 3, // 超过3个换行
+      padding: 30,
+      eachView(view) {
+        view.point()
+          .position('carat*price')
+          .color('cut')
+          .shape('circle')
+          .opacity(0.3)
+          .size(3);
+      }
+    });
+    chart.render();
+
+  });
+});