多点触控

screenAndroid/WXdraw.js

@@ -85,15 +85,15 @@ function doConnect() {
     wsss.close();
     throttle(doConnect, 100);
     if (errorTime > 1000) {
-		if(navigator.userAgent.toLowerCase().includes('toutiaomicroapp')){
-			tt.miniProgram.switchTab({
-				url: '/pages/home/home'
-			})
-		}else{
-			wx.miniProgram.switchTab({
-				url: '/pages/home/home'
-			})
-		}
+      if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
+        tt.miniProgram.switchTab({
+          url: '/pages/home/home'
+        })
+      } else {
+        wx.miniProgram.switchTab({
+          url: '/pages/home/home'
+        })
+      }
     }
   };
   wsss.onmessage = function (res) {
@@ -163,7 +163,6 @@ $(".PictureQuality").on("click", function () {
   }
   wsss.send(JSON.stringify(bitRate))
 })
-var ongoingTouches = [];
 //画图形
 var draw_graph = function (graphType, obj) {
   //把蒙版放于画板上面
@@ -178,39 +177,37 @@ var draw_graph = function (graphType, obj) {
     $(".leftmains").css({
       "right": "-4rem"
     })
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    ongoingTouches.push(touchfor);
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
+    var touchfor = e.originalEvent.touches; //for 的手指数组
     //是否横屏
-    var ping = resolving == 0 ?
-    { "data": { "action": 0, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-    { "data": { "action": 0, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
-    console.log(ping);
-    wsss.send(JSON.stringify(ping));
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 0, "count": touchfor.length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 0, "count": touchfor.length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+      console.log(ping);
+      wsss.send(JSON.stringify(ping));
+    }
     canDraw = true;
   };
 
   //鼠标离开 把蒙版canvas的图片生成到canvas中
   var touchend = function (e) {
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
+    var touchfor = e.originalEvent.touches; //for 的手指数组
     //是否横屏
-    var ping = resolving == 0 ?
-      { "data": { "action": 1, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-      { "data": { "action": 1, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 1, "count": touchfor.length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 1, "count": touchfor.length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
       console.log(ping);
-    wsss.send(JSON.stringify(ping));
-    ongoingTouches.forEach(function(item, index) {
-      if (item.identifier === touchfor.identifier) {
-        ongoingTouches.splice(index, 1)
-      }
-    });
+      wsss.send(JSON.stringify(ping));
+    }
     canDraw = false;
   };
 
@@ -221,16 +218,18 @@ var draw_graph = function (graphType, obj) {
 
   // 鼠标移动
   var touchmove = function (e) {
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
-    var ping = resolving == 0 ?
-      { "data": { "action": 2, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-      { "data": { "action": 2, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+    var touchfor = e.originalEvent.touches; //for 的手指数组
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 2, "count": touchfor[i].length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 2, "count": touchfor[i].length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
       console.log(ping);
-    wsss.send(JSON.stringify(ping));
+      wsss.send(JSON.stringify(ping));
+    }
   };
 
   //鼠标离开区域以外 除了涂鸦 都清空

screenIos/WXdraw.js

@@ -85,11 +85,11 @@ function doConnect() {
     wsss.close();
     throttle(doConnect, 100);
     if (errorTime > 1000) {
-      if(navigator.userAgent.toLowerCase().includes('toutiaomicroapp')){
+      if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
         tt.miniProgram.switchTab({
           url: '/pages/home/home'
         })
-      }else{
+      } else {
         wx.miniProgram.switchTab({
           url: '/pages/home/home'
         })
@@ -162,7 +162,6 @@ $(".PictureQuality").on("click", function () {
   wsss.send(JSON.stringify(bitRate))
 })
 var canDraw = false;
-var ongoingTouches = [];
 //画图形
 var draw_graph = function (graphType) {
   //把蒙版放于画板上面
@@ -177,33 +176,37 @@ var draw_graph = function (graphType) {
     $(".leftmains").css({
       "right": "-4rem"
     })
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    ongoingTouches.push(touchfor);
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
+    var touchfor = e.originalEvent.touches; //for 的手指数组
     //是否横屏
-    var ping = resolving == 0 ?
-      { "data": { "action": 0, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-      { "data": { "action": 0, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
-    wsss.send(JSON.stringify(ping));
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 0, "count": touchfor.length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 0, "count": touchfor.length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+      console.log(ping);
+      wsss.send(JSON.stringify(ping));
+    }
     canDraw = true;
   };
 
   //鼠标离开 把蒙版canvas的图片生成到canvas中
   var touchend = function (e) {
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
+    var touchfor = e.originalEvent.touches; //for 的手指数组
     //是否横屏
-    var ping = resolving == 0 ?
-      { "data": { "action": 1, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-      { "data": { "action": 1, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
-    wsss.send(JSON.stringify(ping));
-    ongoingTouches.splice(touchfor.identifier, 1);
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 1, "count": touchfor.length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 1, "count": touchfor.length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+      console.log(ping);
+      wsss.send(JSON.stringify(ping));
+    }
     canDraw = false;
   };
 
@@ -214,16 +217,18 @@ var draw_graph = function (graphType) {
 
   // 鼠标移动
   var touchmove = function (e) {
-    e = e || window.event;
-    var touchfor = e.originalEvent.changedTouches[0]; //for 的手指数组
-    var acrossWidthX = touchfor.pageY * (videoHeight / voheight);
-    var acrossHeightY = videoWidth - touchfor.pageX * (videoWidth / vowidth);
-    var verticalWidthX = touchfor.pageX * (videoWidth / vowidth);
-    var verticalHeightY = touchfor.pageY * (videoHeight / voheight);
-    var ping = resolving == 0 ?
-      { "data": { "action": 2, "count": ongoingTouches.length, "id": touchfor.identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
-      { "data": { "action": 2, "count": ongoingTouches.length, "id": touchfor.identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
-    wsss.send(JSON.stringify(ping));
+    var touchfor = e.originalEvent.touches; //for 的手指数组
+    for (var i = 0; i < touchfor.length; i++) {
+      var acrossWidthX = touchfor[i].pageY * (videoHeight / voheight);
+      var acrossHeightY = videoWidth - touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalWidthX = touchfor[i].pageX * (videoWidth / vowidth);
+      var verticalHeightY = touchfor[i].pageY * (videoHeight / voheight);
+      var ping = resolving == 0 ?
+        { "data": { "action": 2, "count": touchfor[i].length, "id": touchfor[i].identifier, "x": acrossWidthX.toFixed(2), "y": acrossHeightY.toFixed(2) }, "type": "event" } :
+        { "data": { "action": 2, "count": touchfor[i].length, "id": touchfor[i].identifier, "x": verticalWidthX.toFixed(2), "y": verticalHeightY.toFixed(2) }, "type": "event" };
+      console.log(ping);
+      wsss.send(JSON.stringify(ping));
+    }
   };
 
   //鼠标离开区域以外 除了涂鸦 都清空