@jiaminghi/c-render - npm Package Compare versions

Comparing version 0.3.7 to 0.4.0

CHANGELOG.md

@@ -0,1 +1,7 @@
+# 0.4.0-alpha (2019-06-27)
+
+### Perfect
+
+- **text:** Support for multiple lines of `text`.
+
 # 0.3.7-alpha (2019-06-13)
@@ -2,0 +8,0 @@

lib/class/graph.class.js

@@ -364,3 +364,3 @@ "use strict";
               /*#__PURE__*/
-              regeneratorRuntime.mark(function _callee(reslove) {
+              regeneratorRuntime.mark(function _callee(resolve) {
                 return regeneratorRuntime.wrap(function _callee$(_context) {
@@ -374,3 +374,3 @@ while (1) {
                       case 2:
-                        reslove();
+                        resolve();
 
@@ -484,3 +484,3 @@ case 3:
     /*#__PURE__*/
-    regeneratorRuntime.mark(function _callee3(reslove) {
+    regeneratorRuntime.mark(function _callee3(resolve) {
       return regeneratorRuntime.wrap(function _callee3$(_context3) {
@@ -494,3 +494,3 @@ while (1) {
             case 2:
-              reslove();
+              resolve();
 
@@ -537,5 +537,5 @@ case 3:
 function delay(time) {
-  return new Promise(function (reslove) {
-    setTimeout(reslove, time);
+  return new Promise(function (resolve) {
+    setTimeout(resolve, time);
   });
 }

lib/class/style.class.js

@@ -69,3 +69,3 @@ "use strict";
     /**
-     * @description Rgba value of graph fill color 
+     * @description Rgba value of graph fill color
      * @type {Array}
@@ -77,3 +77,3 @@ * @default fill = [0, 0, 0, 1]
     /**
-     * @description Rgba value of graph stroke color 
+     * @description Rgba value of graph stroke color
      * @type {Array}
@@ -131,3 +131,3 @@ * @default stroke = [0, 0, 0, 1]
     /**
-     * @description Rgba value of graph shadow color 
+     * @description Rgba value of graph shadow color
      * @type {Array}
@@ -134,0 +134,0 @@ * @default shadowColor = [0, 0, 0, 0]

lib/config/graphs.js

@@ -27,2 +27,8 @@ "use strict";
 
+require("core-js/modules/es6.array.for-each");
+
+require("core-js/modules/es6.regexp.split");
+
+require("core-js/modules/es6.regexp.replace");
+
 require("core-js/modules/es6.regexp.to-string");
@@ -819,3 +825,4 @@
     position: [],
-    maxWidth: undefined
+    maxWidth: undefined,
+    rowGap: 0
   },
@@ -825,3 +832,4 @@ validator: function validator(_ref85) {
     var content = shape.content,
-        position = shape.position;
+        position = shape.position,
+        rowGap = shape.rowGap;
 
@@ -834,6 +842,11 @@ if (typeof content !== 'string') {
     if (!(position instanceof Array)) {
-      console.error('Position should be an array!');
+      console.error('Text position should be an array!');
       return false;
     }
 
+    if (typeof rowGap !== 'number') {
+      console.error('Text rowGap should be a number!');
+      return false;
+    }
+
     return true;
@@ -846,6 +859,37 @@ },
         position = shape.position,
-        maxWidth = shape.maxWidth;
+        maxWidth = shape.maxWidth,
+        rowGap = shape.rowGap;
+    var textBaseline = ctx.textBaseline,
+        font = ctx.font;
+    var fontSize = parseInt(font.replace(/\D/g, ''));
+
+    var _position = position,
+        _position2 = _slicedToArray(_position, 2),
+        x = _position2[0],
+        y = _position2[1];
+
+    content = content.split('\n');
+    var rowNum = content.length;
+    var lineHeight = fontSize + rowGap;
+    var allHeight = rowNum * lineHeight - rowGap;
+    var offset = 0;
+
+    if (textBaseline === 'middle') {
+      offset = allHeight / 2;
+      y += fontSize / 2;
+    }
+
+    if (textBaseline === 'bottom') {
+      offset = allHeight;
+      y += fontSize;
+    }
+
+    position = new Array(rowNum).fill(0).map(function (foo, i) {
+      return [x, y + i * lineHeight - offset];
+    });
     ctx.beginPath();
-    ctx.fillText.apply(ctx, [content].concat(_toConsumableArray(position), [maxWidth]));
-    ctx.strokeText.apply(ctx, [content].concat(_toConsumableArray(position), [maxWidth]));
+    content.forEach(function (text, i) {
+      ctx.fillText.apply(ctx, [text].concat(_toConsumableArray(position[i]), [maxWidth]));
+      ctx.strokeText.apply(ctx, [text].concat(_toConsumableArray(position[i]), [maxWidth]));
+    });
     ctx.closePath();
@@ -852,0 +896,0 @@ },

lib/plugin/util.js

@@ -174,6 +174,6 @@ "use strict";
       if (y <= max(p1[1], p2[1])) {
-        if (p1[0] != p2[0]) {
+        if (p1[0] !== p2[0]) {
           var xinters = (x - p1[0]) * (p2[1] - p1[1]) / (p2[0] - p1[0]) + p1[1];
 
-          if (p1[1] == p2[1] || y <= xinters) {
+          if (p1[1] === p2[1] || y <= xinters) {
             counter++;
@@ -180,0 +180,0 @@ }

package.json

 {
   "name": "@jiaminghi/c-render",
-  "version": "0.3.7",
+  "version": "0.4.0",
   "author": "JiaMing <[e-mail]>",
@@ -5,0 +5,0 @@ "description": "Canvas-based vector graphics rendering plugin",

No alert changes

Improved metrics

Total package byte prevSize

134087

increased by0.93%

Lines of code

2572

increased by1.38%

No dependency changes