{"id":43944,"student_id":1981,"content":"{\"html\":\"\u003ccanvas id=\\\"canvas\\\"\u003e\u003c/canvas\u003e\",\"css\":\"canvas {position: absolute; top:30px; left:50%; width: 450px; height: 450px; margin-left: -225px; background-color: #222222;}\",\"js\":\"\\tvar canvas = document.getElementById(\\\"canvas\\\");\\r\\n\\tvar width = canvas.width = 450;\\r\\n\\tvar height = canvas.height = 450;\\r\\n\\tvar ctx = canvas.getContext(\\\"2d\\\");\\r\\n\\tvar current = 0;\\r\\n\\tvar dataNum;\\r\\n\\tvar json;\\r\\n\\tvar ScrrenPoint;\\r\\n\\tvar angle = 0;\\r\\n\\tvar data = [\\r\\n\\t \\t\\t{url:'https://hankuro.sakura.ne.jp/json/animal/elk.json' , point:{x:-100,y:0} , scale:{x:1,y:1}},\\r\\n\\t \\t\\t{url:'https://hankuro.sakura.ne.jp/json/animal/wolf.json' , point:{x:100,y:100} , scale:{x:1,y:1}},\\r\\n\\t \\t\\t{url:'https://hankuro.sakura.ne.jp/json/animal/fox.json' , point:{x:70,y:0} , scale:{x:1,y:1}},\\r\\n\\t \\t\\t{url:'https://hankuro.sakura.ne.jp/json/animal/retreiver.json' , point:{x:80,y:-150} , scale:{x:1,y:1}}\\r\\n\\t ];\\r\\n\\tvar animes = [];\\r\\n\\r\\n\\tdata.forEach(function(d,i){animes.push(new animestion(i));});\\r\\n\\tvar perv = 0 , m = 0;\\r\\n\\td3.timer(function(elapsed){\\r\\n\\t\\tm += (elapsed - perv);\\r\\n\\t\\tperv = elapsed;\\r\\n\\t\\tif(m \u003c 30) return;\\r\\n\\t\\tm = 0;\\r\\n\\t\\tctx.setTransform(1,0,0,1,0,0);\\r\\n\\t\\tctx.clearRect(0,0,width,height);\\r\\n\\t\\tanimes.forEach(function(a){\\r\\n\\t\\t\\tif(a.ready) a.draw();\\r\\n\\t\\t})\\r\\n\\t})\\r\\n\\r\\n\\r\\n\\tfunction animestion(index){\\r\\n\\t\\tvar url = data[index].url;\\r\\n\\t\\tthis.point = data[index].point;\\r\\n\\t\\tthis.scale = data[index].scale;\\r\\n\\t\\tthis.ready = false;\\r\\n\\t\\td3.json(url, function(error, root) {\\r\\n\\t\\t\\tthis.json = root;\\r\\n\\t\\t\\tthis.ScrrenPoint = new vertex();\\r\\n\\t\\t\\tthis.angle = 0;\\r\\n\\t\\t\\tthis.current = 0;\\r\\n\\t\\t\\tthis.ready = true;\\r\\n\\t\\t}.bind(this))\\r\\n\\t}\\r\\n\\tanimestion.prototype.draw = function(){\\r\\n\\t\\tctx.setTransform(1,0,0,1,0,0);\\r\\n\\t\\tctx.translate(width/2+this.point.x,height/2-this.point.y);\\r\\n\\t\\tctx.scale(this.scale.x,-this.scale.y);\\r\\n\\t\\tctx.fillStyle = \\\"rgba(255,255,255,0.8)\\\";\\r\\n\\t\\tthis.current = this.current + 1 != this.json.morphTargets.length ? this.current : 0;\\r\\n\\t\\tvar vecs = this.json.morphTargets[this.current].vertices;\\r\\n\\t\\tvar sin = Math.sin(this.angle);\\r\\n\\t\\tvar cos = Math.cos(this.angle);\\r\\n\\t\\tfor(var i=0;i\u003cvecs.length;i+=3){\\r\\n\\t\\t\\tvar p = [vecs[i+0],vecs[i+1],vecs[i+2]];\\r\\n\\t\\t\\tvar po = [0,0,0];\\r\\n\\t\\t\\tpo[0] = cos * p[0] - sin * p[2] ;\\r\\n\\t\\t\\tpo[1] = p[1] - 30;\\r\\n\\t\\t\\tpo[2] = cos * p[2] + sin * p[0];\\r\\n\\t\\t\\tthis.ScrrenPoint.setVertex(po);\\r\\n\\t\\t\\tvar sp = this.ScrrenPoint.getScrrenPoint();\\r\\n\\t\\t\\tctx.fillRect(sp.x,sp.y,1/this.scale.x,1/this.scale.y);\\r\\n\\t\\t}\\r\\n\\t\\tthis.current++;\\r\\n\\t\\tthis.angle += 0.01;\\r\\n\\t}\\r\\n\\r\\n\\tfunction vertex(){\\r\\n\\t\\tthis.x = 0;\\r\\n\\t this.y = 0;\\r\\n\\t this.z = 0;\\r\\n\\t this.fl = 1000;\\r\\n\\t}\\r\\n\\tvertex.prototype.setVertex = function(p){\\r\\n\\t\\tthis.x = p[0];\\r\\n\\t this.y = p[1];\\r\\n\\t this.z = p[2];\\r\\n\\t}\\r\\n\\tvertex.prototype.getScrrenPoint = function(){\\r\\n\\t\\tvar scale_z = this.fl + this.z;\\r\\n\\t var scale = this.fl / scale_z;\\r\\n\\t var x = this.x * scale;\\r\\n\\t var y = this.y * scale;\\r\\n\\t return {x:x , y:y , scale:scale};\\r\\n\\t}\\r\\n\"}","created_at":"2018-10-05T15:41:03.173+08:00","updated_at":"2019-10-28T08:26:08.275+08:00","name":"test","language":"web","screenshot":{"url":"https://cdn8.koding.school/uploads/project/screenshot/43944/ae3ef44b944dce28af3bd845094d1196.jpg"},"parent_id":null,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":80,"hashid":"zpes8v26","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}
[]
橘蘋學習平台
橘蘋學習平台
我的作品
檢視專案頁
匯出
複製
匯入
刪除
下載 Android APP (APK)
截圖
前往網站頁面
1:1:1
1:1
full
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦