Height calculation optimization

Height calculation optimization

Author: ushelp

dist/easy.qrcode.min.js

@@ -1,6 +1,6 @@
 {
 	"name": "easyqrcodejs",
-	"version": "4.4.10",
+	"version": "4.4.12",
 	"description": "Cross-browser QRCode generator for pure javascript. Support Canvas, SVG and Table drawing methods. Support Dot style, Logo, Background image, Colorful, Title etc. settings. Support Angular, Vue.js, React, Next.js, Svelte framework. Support binary(hex) data mode.(Running with DOM on client side)",
 	"main": "dist/easy.qrcode.min.js",
 	"scripts": {},

package.json

@@ -28,6 +28,7 @@ EasyQRCodeJS 是一个功能丰富的跨浏览器的纯 JavaScript QRCode 生成
   - [Svelte Support](#svelte-support)
   - [FQA](#fqa)
     - [Q1. Tainted canvases may not be exported.](#q1-tainted-canvases-may-not-be-exported)
+    - [Q2. How to show the QRCode image only after rendering is done?](#q2-how-to-show-the-qrcode-image-only-after-rendering-is-done)
   - [Browser Compatibility](#browser-compatibility)
   - [License](#license)
   - [EasyQRCodeJS-Premium](#easyqrcodejs-premium)
@@ -774,6 +775,16 @@ When use canvas drawer, Canvas toDataURL function does not allow load cross doma
   Use base64 image.
 
 
+### Q2. How to show the QRCode image only after rendering is done?
+
+```JS
+onRenderingStart: function(qrCodeOptions) {
+    qrCodeOptions._element.style.display = 'none';
+},
+onRenderingEnd: function(qrCodeOptions) {
+    qrCodeOptions._element.style.display = 'block';
+},
+```
 
 ## Browser Compatibility
 IE6+, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile, ETC.

readme.md

@@ -3,7 +3,7 @@
  * 
  * Cross-browser QRCode generator for pure javascript. Support Canvas, SVG and Table drawing methods. Support Dot style, Logo, Background image, Colorful, Title etc. settings. Support Angular, Vue.js, React, Next.js, Svelte framework. Support binary(hex) data mode.(Running with DOM on client side)
  * 
- * Version 4.4.10
+ * Version 4.4.12
  * 
  * @author [ [email protected] ]
  * 
@@ -1430,11 +1430,6 @@
             // var _elImage = this._elImage;
             var _htOption = this._htOption;
 
-            if (!_htOption.title && !_htOption.subTitle) {
-                _htOption.height -= _htOption.titleHeight;
-                _htOption.titleHeight = 0;
-            }
-
             var nCount = oQRCode.getModuleCount();
             var nWidth = Math.round(_htOption.width / nCount);
             var nHeight = Math.round((_htOption.height - _htOption.titleHeight) / nCount);
@@ -2026,6 +2021,10 @@
             }
         }
 
+        if (!this._htOption.title && !this._htOption.subTitle) {
+            this._htOption.titleHeight = 0;
+        }
+
         if (this._htOption.version < 0 || this._htOption.version > 40) {
             console.warn("QR Code version '" + this._htOption.version + "' is invalidate, reset to 0")
             this._htOption.version = 0;
@@ -2116,6 +2115,8 @@
         this._el = el;
         this._oQRCode = null;
 
+        this._htOption._element = el;
+
         var _htOptionClone = {};
         for (var i in this._htOption) {
             _htOptionClone[i] = this._htOption[i];