正剧开始:
星历2016年03月20日 14:04:26, 银河系厄尔斯星球中华帝国江南行省。
[工程师阿伟]正在和[机器小伟]一起研究[平行四边形 小结与复习题]。
上一节功法中,由于阿伟一时没有注意,导致四边形的数据没法进行变换,
这样,带来了很多的不便。画个图还要用手工,这可怎么行呢,
这次,阿伟就先把这个变换的工具做出来了,想必后面的题就好做了。
<span style="font-size:18px;">/** * @usage 对点阵列数组进行平移,旋转,缩放,对称等变形 * @author mw * @date 2016年03月20日 星期日 13:24:58 * @param 传入点阵列矩阵 * @return 输出变形后的点阵列矩阵 * */ function Transform() { this.translate = function(array, xOffset, yOffset) { var len = array.length; if (len == 0) { return []; } else { var len1 = array[0].length; if (len1 != 2) { //如果不是点阵列[..., [x,y], [x1,y1], ...]的格式,暂时不加处理 return array; } else { var retArray = new Array(); var x = 0, y = 0; for (var i = 0; i < len; i++) { x = array[i][0] + xOffset; y = array[i][1] + yOffset; retArray.push([x, y]); } } } return retArray; } this.scale = function(array, scale) { var len = array.length; if (len == 0) { return []; } else { var len1 = array[0].length; if (len1 != 2) { //如果不是点阵列[..., [x,y], [x1,y1], ...]的格式,暂时不加处理 return array; } else { var retArray = new Array(); var x = 0, y = 0; for (var i = 0; i < len; i++) { x = array[i][0] * scale; y = array[i][1] * scale; retArray.push([x, y]); } } } return retArray; } this.rotate = function(array, angle) { var len = array.length; if (len == 0) { return []; } else { var len1 = array[0].length; if (len1 != 2) { //如果不是点阵列[..., [x,y], [x1,y1], ...]的格式,暂时不加处理 return array; } else { var retArray = new Array(); var x = 0, y = 0; var sinA, cosA; for (var i = 0; i < len; i++) { sinA = Math.sin(angle); cosA = Math.cos(angle); x = array[i][0] * cosA - array[i][1]*sinA; y = array[i][0] * sinA + array[i][1]*cosA; retArray.push([x, y]); } } } return retArray; } this.flipX = function(array) { return this.flipImplement(array, 'X'); } this.flipY = function(array) { return this.flipImplement(array, 'Y'); } //关于直线y=kx轴对称 this.flip = function(array, slope) { //slope为斜率k var mode = slope.toFixed(3); return this.flipImplement(array, mode); } this.flipImplement = function(array, mode) { var len = array.length; if (len == 0) { return []; } else { var len1 = array[0].length; if (len1 != 2) { //如果不是点阵列[..., [x,y], [x1,y1], ...]的格式,暂时不加处理 return array; } else { var retArray = new Array(); var x = 0, y = 0; var sinA, cosA; var m = 0, n = 0; if (mode == 'X') { for (var i = 0; i < len; i++) { //关于X轴对称, x = array[i][0]; y = -array[i][1]; retArray.push([x, y]); } } else if (mode == 'Y') { for (var i = 0; i < len; i++) { //关于Y轴对称, x = -array[i][0]; y = array[i][1]; retArray.push([x, y]); } } else { //模式为斜率 y = kx中k的字符串 k = parseFloat(mode); for (var i = 0; i < len; i++) { //可扩展 //此处先放大100倍再缩小是因为对于小尺寸 //计算误差太大,而如果尺寸太大, //标注会占用太多地方,造成文字拥挤,无法读取 m = array[i][0]*100; n = array[i][1]*100; //x = (m-2*k+2*k*n-m*k*k)/(1+k*k); x = (1-k*k)*m+2*k*(n-1)/(1+k*k); //y = (-n+2*k*m+n*k*k)/(1+k*k); y = (2*k*m-(1-k*k)*n)/(1+k*k); retArray.push([x/100, y/100]); } } } } return retArray; } } </span>
<span style="font-size:18px;"> var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var tmp = []; /* config.setSector(3,3,1,1); a = triangle.know2edges([10, 8], -90); tmp = [].concat(a); //document.write(tmp); shape.angleDraw(tmp, 'red', 20); */ config.setSector(3,3,2,2); a = triangle.know2edges([1, 2]); var b = []; b = transform.flip(a, 1); //document.write(a+'<br>'); //document.write(b); tmp = [].concat(a); shape.angleDraw(tmp, 'green', 80); tmp = [].concat(b); //document.write(tmp); shape.angleDraw(tmp, 'red', 80, 'BCA');</span>
这是关于y=x对称的两个三角形,看得出来是正确的。这下就好办了。
<span style="font-size:18px;">//1(2) var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var b = []; var tmp = []; config.setSector(3,3,2,2); a = triangle.know2edges([2, 1], -90); tmp = [].concat(transform.translate(transform.flipY(a), 0, 1.5)); shape.angleDraw(tmp, 'green', 80); a = transform.flipY(a); tmp = [].concat(a); shape.strokeDraw(tmp, 'green', 80); b = shape.paraquad(0, 0, 0, -2, 2, Math.PI/6); tmp = [].concat(b); //document.write(tmp); shape.angleDraw(tmp, 'red', 80); //1(3) var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var b = []; var tmp = []; config.setSector(3,3,2,2); a = triangle.know2edges([1, 1], 150); tmp = [].concat(transform.translate(transform.flipY(a), 0, 1.5)); shape.angleDraw(tmp, 'green', 80); a = transform.flipY(a); tmp = [].concat(a); shape.strokeDraw(tmp, 'green', 80); b = shape.paraquad(0, 0, 0, -1, 1, Math.PI/2); tmp = [].concat(b); shape.angleDraw(tmp, 'red', 80); var c = []; c = triangle.know3edges([1, 1, 1]); tmp = [].concat(transform.rotate(c,-Math.PI/6)); shape.strokeDraw(tmp, 'red', 80);</span>
<span style="font-size:18px;">//9(2), 9(3) var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var b = []; var tmp = []; config.setSector(3,3,2,2); b = shape.paraquad(0, 0, 0, -1, 1, Math.PI/3); tmp = [].concat(b); shape.angleDraw(tmp, 'red', 100); for (var i = 0; i < 4; i++) { if (i == 3) { a.push([(b[i][0]+b[0][0])/2, (b[i][1]+b[0][1])/2]); } else { a.push([(b[i][0]+b[i+1][0])/2, (b[i][1]+b[i+1][1])/2]); } } shape.strokeDraw([].concat(a), 'green', 100); shape.angleDraw(transform.translate(a, 0, 1.5), 'green', 100); </span>
<span style="font-size:18px;"> var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var b = []; var tmp = []; config.setSector(3,3,1,1); var angle = 45; var w = 2, h = 2; b = triangle.know2edges([w, h], angle); tmp = [].concat(b); shape.angleDraw(tmp, 'red', 100); a = triangle.know2edges([-w, -h], angle); a = transform.translate(a, w+h*Math.cos(angle/180*Math.PI), -h*Math.sin(angle/180*Math.PI)); tmp = [].concat(a); shape.angleDraw(tmp, 'green', 100);</span>
<span style="font-size:18px;"> var r = 20; config.setSector(1,1,1,1); config.graphPaper2D(0, 0, r); config.axis2D(0, 0,180); var triangle = new Triangle(); var transform = new Transform(); var a = []; var b = []; var tmp = []; config.setSector(3,3,1,1); var angle = 90; var w = 2, h = 2; b = shape.paraquad(0, 0, 0, w, h, angle/180*Math.PI); tmp = [].concat(b); shape.strokeDraw(tmp, 'red', 100); a = triangle.know2edges([w/2, h], angle); a = transform.translate(transform.flipX(a), 0, -h); tmp = [].concat(a); shape.angleDraw(tmp, 'green', 100); var c = triangle.know2edges([-w, -h/2], angle); c = transform.translate(c, w*1.5, -h); tmp = [].concat(c); shape.angleDraw(tmp, 'orange', 100); var d = triangle.know2edges([-1, -2.24], 26.57); d = transform.translate(transform.flipY(d), w/2, -h); tmp = [].concat(d); shape.strokeDraw(tmp, 'cyan', 100); tmp = [].concat(transform.translate(d, 0, 1.5)); shape.angleDraw(tmp, 'cyan', 100);</span>