亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

js 面向對象問題。new 出來的對象相互影響怎么回事啊。

js 面向對象問題。new 出來的對象相互影響怎么回事啊。

慕粉1469491289 2017-09-26 14:38:00
js 文件:? ? //壓路機對象? ? function Ylj(json){? ? ? 'use strict';? ? ? var _this = this;? ? ? this.timer = null;? ? ? this.color = json.color;? ? ? this.width = json.width;? ? ? this.speed = json.speed;? ? ? this.C = document.getElementById('c1'); //路徑畫布? ? ? this.picStage = document.getElementById('c2'); //? ? ? this.pic = new Image();? ? ? this.pic.src='./img/icon-ylj.png';? ? ? this.pGC = this.picStage.getContext('2d');? ? ? this.GC = this.C.getContext('2d');? ? ? this.GC.lineWidth = json.width;? ? ? this.GC.strokeStyle = json.color;? ? ? this.disX = json.disX;? ? ? this.disY = json.disY;? ? ? this.line = 0;? ? ? this.count = 0;? ? ? this.start = function(arr){? ? ? ? _this.startDraw(_this,arr);? ? ? };? ? ? this.stop = function(){? ? ? ? _this.stopDraw(_this);? ? ? };? ? }? ? Ylj.prototype.stopDraw=function(obj){? ? ? 'use strict';? ? ? ?clearTimeout(obj.timer);? ? };? ? Ylj.prototype.startDraw=function(obj,arr){? ? ? 'use strict';? ? ? var C = document.getElementById('c3'); //重復路徑部分畫布? ? ? var GC = C.getContext('2d');? ? ? var x0 = obj.disX;? ? ? var y0 = obj.disY;? ? ? obj.GC.lineCap = 'round';? ? ? obj.GC.globalCompositeOperation="lighter";? ? ? ? ?// 移動到初始位置? ? ? ? obj.GC.moveTo(obj.disX,obj.disY);? ? ? ? obj.GC.beginPath();? ? ? ? for(let i=0;i<=arr.length;i++){? ? ? ? ? obj.timer=setTimeout(function(){? ? ? ? ? ? if(i==arr.length){? ? ? ? ? ? ? clearTimeout(obj.timer);? ? ? ? ? ? ? obj.GC.stroke();? ? ? ? ? ? ? obj.GC.closePath();? ? ? ? ? ? ? return ;? ? ? ? ? ? }? ? ? ? ? ? //獲取經緯度轉換坐標值? ? ? ? ? ? for(let v in arr[i]){? ? ? ? ? ? ? if(v == 'X'){? ? ? ? ? ? ? ? x0 = arr[i][v];? ? ? ? ? ? ? }else{? ? ? ? ? ? ? ? y0 = arr[i][v];? ? ? ? ? ? ? }? ? ? ? ? ? }? ? ? ? ? ? ?// 繪制壓路機圖片? ? ? ? ? ? ?obj.pGC.clearRect(0,0,obj.picStage.width,obj.picStage.height);? ? ? ? ? ? ?// obj.pGC.rotate()? ? ? ? ? ? ?obj.pGC.drawImage(obj.pic,x0-50,y0-70);? ? ? ? ? ? ?// 繪制壓路機經過路徑? ? ? ? ? ? ?obj.GC.lineTo(x0,y0)? ? ? ? ? },obj.speed);? ? ? ? }? ? }HTML:let ylj1 = new Ylj({? ? ? ? color:'red',? ? ? ? width:30,? ? ? ? speed:10,? ? ? ? disX:100,? ? ? ? disY:0? ? ? });? ? ? let ylj2 = new Ylj({? ? ? ? color:'blue',? ? ? ? width:30,? ? ? ? speed:1000,? ? ? ? disX:1000,? ? ? ? disY:0? ? ? });? ? ? console.log(ylj1==ylj2);? ? function go(){? ? ? let timer=setTimeout(go,300);? ? ? function go1(){? ? ? ? if(arr.length==0) {? ? ? ? ? clearTimeout(timer);? ? ? ? ? return ;? ? ? ? }? ? ? ? let arr1 = arr;? ? ? ? arr=[];? ? ? ? ylj1.start(arr1);? ? ? ? ylj2.start(arr1);? ? ? }? ? ?go1();? ? }? ? add();? ? go();ylj1和ylj2最后只有壓路機2在畫了,怎么回事啊,求教大神~~~~~
查看完整描述

1 回答

?
菜鳥教程

TA貢獻25條經驗 獲得超33個贊

實例化出來的東西是不會互相影響的,按照你的代碼邏輯,你執行的所有startDraw都會畫在c3這個canvas上面,建議從這個地方入手看看。

查看完整回答
2 反對 回復 2017-09-27
  • 1 回答
  • 0 關注
  • 1426 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號