jmgraph 3.2.21 → 3.2.22

package/package.json

@@ -1,7 +1,7 @@
 {
   "family": "jmgraph",
   "name": "jmgraph",
-  "version": "3.2.21",
+  "version": "3.2.22",
   "description": "一个简单的canvas画图库",
   "homepage": "https://surl.fit/tools/tools/jmgraph",
   "keywords": [

package/src/core/jmControl.js

@@ -1114,7 +1114,15 @@ export default class jmControl extends jmProperty {
 	 * @param {array} args 事件参数数组
 	 */
 	emit(...args) {			
-		this.runEventHandle(args[0], args.slice(1));
+		// 避免每帧 args.slice(1) 分配临时数组
+		// runEventHandle 内部会把非数组参数包装成数组
+		if(args.length > 2) {
+			this.runEventHandle(args[0], args.slice(1));
+		} else if(args.length === 2) {
+			this.runEventHandle(args[0], [args[1]]);
+		} else {
+			this.runEventHandle(args[0], []);
+		}
 		return this;
 	}
 

package/src/core/jmGraph.js

@@ -412,13 +412,19 @@ export default class jmGraph extends jmControl {
 			this.context.clearRect(0, 0, w, h);
 		}
 		else if(this.mode === 'webgl' && this.context.clear) {
-			const color = this.style && this.style.fill? this.utils.hexToRGBA(this.style.fill): {
-				r: 0,
-				g: 0,
-				b: 0,
-				a: 0
-			};
-			this.context.clearColor(color.r, color.g, color.b, color.a); // 设置清空颜色缓冲时的颜色值
+			// 缓存 clearColor 对象，避免每帧创建
+			if(this.style && this.style.fill) {
+				const color = this.utils.hexToRGBA(this.style.fill);
+				this.__lastClearColor = color;
+				this.context.clearColor(color.r, color.g, color.b, color.a);
+			}
+			else if(!this.__lastClearColor) {
+				this.__lastClearColor = { r: 0, g: 0, b: 0, a: 0 };
+				this.context.clearColor(0, 0, 0, 0);
+			}
+			else {
+				this.context.clearColor(this.__lastClearColor.r, this.__lastClearColor.g, this.__lastClearColor.b, this.__lastClearColor.a);
+			}
         	this.context.clear(this.context.COLOR_BUFFER_BIT); // 清空颜色缓冲区，也就是清空画布
 		}
 	}
@@ -745,7 +751,7 @@ export default class jmGraph extends jmControl {
 			// 触发刷新事件
 			self.emit('update', time);
 
-			self.__requestAnimationFrameFunHandler && self.cancelAnimationFrame(self.__requestAnimationFrameFunHandler);
+			// 直接 requestAnimationFrame，无需先 cancel
 			self.__requestAnimationFrameFunHandler = self.requestAnimationFrame(update);
 			if(callback) callback();
 		}

package/src/lib/webgl/path.js

@@ -55,8 +55,14 @@ class WebglPath extends WebglBase {
         //this.useProgram();
 
         if(parentBounds) this.parentAbsoluteBounds = parentBounds;
-        // 写入当前canvas大小
-        this.context.uniform2f(this.program.uniforms.a_center_point.location, this.graph.width / 2, this.graph.height / 2);
+        // 缓存中心点值，只在变化时才更新 uniform
+        const cx = this.graph.width / 2;
+        const cy = this.graph.height / 2;
+        if(this.__lastCenterX !== cx || this.__lastCenterY !== cy) {
+            this.context.uniform2f(this.program.uniforms.a_center_point.location, cx, cy);
+            this.__lastCenterX = cx;
+            this.__lastCenterY = cy;
+        }
     }
 
     setFragColor(color) {

package/src/shapes/jmArc.js

@@ -123,7 +123,6 @@ export default class jmArc extends jmPath {
 		if((mw == 0 && mh == 0) || start == end) return;
 
 		let anticlockwise = this.anticlockwise;
-		this.points = [];
 		let step = 1 / Math.max(mw, mh);
 
 		//如果是逆时针绘制，则角度为负数，并且结束角为2Math.PI-end
@@ -134,18 +133,33 @@ export default class jmArc extends jmPath {
 		}
 		if(start > end) step = -step;
 
-		if(this.isFan) this.points.push(location.center);// 如果是扇形，则从中心开始画
+		// 预计算需要的点数量
+		let pointCount = Math.ceil(Math.abs(end - start) / Math.abs(step)) + 1;
+		if(this.isFan) pointCount++;
+
+		// 复用已有数组，避免每帧分配；大小变化时才重建
+		if(!this.points || this.points.length !== pointCount) {
+			this.points = new Array(pointCount);
+			for(let i = 0; i < pointCount; i++) {
+				this.points[i] = { x: 0, y: 0 };
+			}
+		}
+
+		let idx = 0;
+		if(this.isFan) {
+			this.points[idx].x = location.center.x;
+			this.points[idx].y = location.center.y;
+			idx++;
+		}
 		
 		//椭圆方程x=a*cos(r) ,y=b*sin(r)	
 		for(let r=start;;r += step) {	
 			if(step > 0 && r > end) r = end;
 			else if(step < 0 && r < end) r = end;
 
-			const p = {
-				x : Math.cos(r) * mw + cx,
-				y : Math.sin(r) * mh + cy
-			};
-			this.points.push(p);
+			this.points[idx].x = Math.cos(r) * mw + cx;
+			this.points[idx].y = Math.sin(r) * mh + cy;
+			idx++;
 
 			if(r == end) break;
 		}