jmgraph 3.1.95 → 3.1.96

package/src/core/jmControl.js

@@ -341,9 +341,6 @@ export default class jmControl extends jmProperty {
 		style = style || jmUtils.clone(this.style, true);
 		if(!style) return;
 
-		// 当前根据屏幕放大倍数，如果有倍数，则需要对线宽等同比放大
-		let scale = this.graph.devicePixelRatio;
-
 		/**
 		 * 样式设定
 		 * 
@@ -393,7 +390,7 @@ export default class jmControl extends jmProperty {
 					}
 
 					// 按比例需要放大的样式
-					if(scale && style) {
+					/*if(scale && style) {
 						switch(mpname) {
 							case 'lineWidth': {
 								style *= scale;
@@ -410,7 +407,7 @@ export default class jmControl extends jmProperty {
 								break;
 							}
 						}
-					}					
+					}		*/			
 					this.context[mpname] = style;
 				}	
 				else {
@@ -592,10 +589,10 @@ export default class jmControl extends jmProperty {
 		local.height = this.height;
 
 		let margin = jmUtils.clone(this.style.margin, {});
-		margin.left = (margin.left || 0) * this.graph.devicePixelRatio;
-		margin.top = (margin.top || 0) * this.graph.devicePixelRatio;
-		margin.right = (margin.right || 0) * this.graph.devicePixelRatio;
-		margin.bottom = (margin.bottom || 0) * this.graph.devicePixelRatio;
+		margin.left = (margin.left || 0);
+		margin.top = (margin.top || 0);
+		margin.right = (margin.right || 0);
+		margin.bottom = (margin.bottom || 0);
 		
 		//如果没有指定位置，但指定了margin。则位置取margin偏移量
 		if(local.position) {
@@ -1114,14 +1111,7 @@ export default class jmControl extends jmProperty {
 
 			const srcElement = args.srcElement || args.target;			
 			
-			const position = jmUtils.getEventPosition(args, graph.scaleSize);//初始化事件位置		
-
-			// 如果有指定scale高清处理，需要对坐标处理
-			// 因为是对canvas放大N倍，再把style指定为当前大小，所以坐标需要放大N    && srcElement === graph.canvas      
-			if(graph.devicePixelRatio > 0) {
-				position.x = position.offsetX = position.x * graph.devicePixelRatio;
-				position.y = position.offsetY = position.y * graph.devicePixelRatio;
-			}
+			const position = jmUtils.getEventPosition(args, graph.scaleSize);//初始化事件位置
 		
 			args = {
 				position: position,

package/src/core/jmGraph.js

@@ -100,11 +100,19 @@ export default class jmGraph extends jmControl {
 		this.on('endDraw', function() {	
 			this.context.translate(-0.5, -0.5);		
 		});
-		
+
+		// devicePixelRatio初始化
+		let dpr = typeof window != 'undefined' && window.devicePixelRatio > 1? window.devicePixelRatio : 1;
+		if(this.isWXMiniApp) {
+			dpr = wx.getSystemInfoSync().pixelRatio || 1;
+		}		
+		this.devicePixelRatio = dpr;
+		// 为了解决锯齿问题，先放大canvas再缩放
+		this.dprScaleSize = this.devicePixelRatio > 1? this.devicePixelRatio : 2;
+
 		if(this.option.width > 0) this.width = this.option.width;
 		if(this.option.height > 0) this.height = this.option.height;	
-
-		this.resize();
+		this.resize();		
 
 		//绑定事件
 		this.eventHandler = new jmEvents(this, this.canvas.canvas || this.canvas);	
@@ -119,25 +127,19 @@ export default class jmGraph extends jmControl {
 
 	//  重置canvas大小，并判断高清屏，画图先放大二倍
 	resize(w, h) {
+		if(!this.canvas) return;
 
-		let scale = typeof window != 'undefined' && window.devicePixelRatio > 1? window.devicePixelRatio : 1;
-		if(this.isWXMiniApp) {
-			scale = wx.getSystemInfoSync().pixelRatio || 1;
-		}
-		else if (scale > 1) {
-		  this.__normalSize = this.__normalSize || { width: 0, height: 0};
-		  w = w || this.__normalSize.width || this.width, h = h || this.__normalSize.height || this.height;
+		this.__normalSize = this.__normalSize || { width: 0, height: 0};
+		w = w || this.__normalSize.width || this.width, h = h || this.__normalSize.height || this.height;
 
-		  if(w) this.__normalSize.width = w;
-		  if(h) this.__normalSize.height = h;
-		
-		  this.canvas.style && (this.canvas.style.width = w + "px");
-		  this.canvas.style && (this.canvas.style.height = h + "px");
-		  this.canvas.height = h * scale;
-		  this.canvas.width = w *scale;
-		  this.context.scale(scale, scale);
-		  this.devicePixelRatio = scale;
-		}
+		if(w) this.__normalSize.width = w;
+		if(h) this.__normalSize.height = h;
+	
+		this.css('width', w + "px");
+		this.css('height', h + "px");
+		this.canvas.height = h * this.dprScaleSize;
+		this.canvas.width = w * this.dprScaleSize;
+		this.context.scale(this.dprScaleSize, this.dprScaleSize);	
 	}
 
 	/**
@@ -145,10 +147,10 @@ export default class jmGraph extends jmControl {
 	 * @param {x, y} point 内部坐标
 	 */
 	pointToPixes(point) {
-		if(this.devicePixelRatio && this.devicePixelRatio !== 1) {
+		if(this.dprScaleSize && this.dprScaleSize !== 1) {
 			point = Object.assign({}, point, {
-				x: point.x / this.devicePixelRatio,
-				y: point.y / this.devicePixelRatio
+				x: point.x / this.dprScaleSize,
+				y: point.y / this.dprScaleSize
 			});
 		}
 		return point;
@@ -160,13 +162,13 @@ export default class jmGraph extends jmControl {
 	 * @type {number}
 	 */
 	get width() {
+		if(this.__normalSize && this.__normalSize.width) return this.__normalSize.width;
 		if(this.canvas) return this.canvas.width;
 		return 0;
 	}
 	set width(v) {
 		this.needUpdate = true;
 		if(this.canvas) {
-			this.canvas.width = v;	
 			this.resize(v);
 		}	
 		return v;
@@ -178,13 +180,13 @@ export default class jmGraph extends jmControl {
 	 * @type {number}
 	 */
 	get height() {
+		if(this.__normalSize && this.__normalSize.height) return this.__normalSize.height;
 		if(this.canvas) return this.canvas.height;
 		return 0;
 	}
 	set height(v) {
 		this.needUpdate = true;
 		if(this.canvas) {
-			this.canvas.height = v;
 			this.resize(0, v);
 		}
 		return v;
@@ -343,23 +345,13 @@ export default class jmGraph extends jmControl {
 	 * @param {number} [h] 清除画布的高度
 	 */
 	clear(w, h) {
-		//this.canvas.width = this.canvas.width;
-		if(w && h) {
-			//this.zoomActual();//恢复比例缩放
-			this.canvas.width = w;
-			this.canvas.height = h;
-			//保留原有缩放比例
-			if(this.scaleSize) {
-				if(this.context.scale) this.context.scale(this.scaleSize.x,this.scaleSize.y);
-			}
-		}
-		else {
-			w = this.canvas.width;
-			h = this.canvas.height;
-			if(this.scaleSize) {
+		if(!w || !h) {
+			w = this.width;
+			h = this.height;
+			/*if(this.scaleSize) {
 				w = w / this.scaleSize.x;
 				h = h / this.scaleSize.y;
-			}
+			}*/
 		}
 		//如果有指定背景，则等到draw再全屏绘制一次，也同样达到清除画布的功能
 		if(this.style && this.style.fill) {
@@ -504,6 +496,9 @@ export default class jmGraph extends jmControl {
 				return;// 已销毁
 			}
 			if(self.needUpdate) self.redraw();
+			// 触发刷新事件
+			self.emit('update');
+
 			self.__requestAnimationFrameFunHandler && jmUtils.cancelAnimationFrame(self.__requestAnimationFrameFunHandler);
 			self.__requestAnimationFrameFunHandler = jmUtils.requestAnimationFrame(update);
 			if(callback) callback();