矩形平移旋转的仿射变换
By
admin
at 2020-03-24 • 0人收藏 • 1690人看过
考虑用echarts弄个简易的演示画板,里面对一个给定的矩形进行平移旋转
这种旋转平移矩阵应该怎么去计算呢?
先记录一下, 弄通的时候来更新下.哈
var symbolSize = 30; var data = [[0, 0], [0, 15], [15, 15], [15, 0],[0,0]]; //模拟平移数据 var data2 = [[1, 1], [1, 16], [16, 16], [16, 1],[1,1]]; option = { title: { text: 'Try Dragging these Points' }, grid: { show: false }, xAxis: { splitLine: {show: false}, type: 'value', boundaryGap: false, axisLine: {show: false,}, axisLabel: {show: false}, axisTick: {show: false}, }, yAxis: { splitLine: {show: false}, type: 'value', axisLine: {show: false,}, axisLabel: {show: false}, axisTick: {show: false}, }, series: [ { type: 'line', lineStyle: { color: 'green', width: 0 }, showSymbol: false, data: data2, areaStyle: { color: 'green', }, }, { type: 'line', lineStyle: { color: 'red', width: 0 }, areaStyle: { color: 'red', }, showSymbol: false, data: data } ] };
2 个回复 | 最后更新于 2020-04-08
从上面二楼的echarts旋转结果来看,貌似上面公式有问题, 于是今天用EWDraw控件来画出来判断是不是百度图表绘制变形导致。
结果显示: 公式完全正确,百度图表缩放导致
ewdraw控件测试代码如下:
import win.ui; /*DSG{{*/ var winform = win.form(text="aardio form";right=759;bottom=741) winform.add( button={cls="button";text="开启网格";left=11;top=428;right=175;bottom=470;z=1}; button2={cls="button";text="画线";left=194;top=428;right=288;bottom=470;z=3}; button3={cls="button";text="画圆";left=293;top=428;right=387;bottom=470;z=4}; button4={cls="button";text="画线";left=168;top=486;right=314;bottom=597;z=5}; button5={cls="button";text="画线";left=557;top=564;right=703;bottom=640;z=22}; button6={cls="button";text="计算";left=558;top=481;right=704;bottom=557;z=23}; edit={cls="edit";text="0";left=430;top=423;right=552;bottom=456;edge=1;multiline=1;z=24}; edit1={cls="edit";text="0";left=13;top=480;right=69;bottom=513;edge=1;z=6}; edit10={cls="edit";text="0";left=457;top=489;right=513;bottom=522;edge=1;multiline=1;z=14}; edit11={cls="edit";text="0";left=385;top=528;right=441;bottom=561;edge=1;z=17}; edit12={cls="edit";text="0";left=456;top=527;right=512;bottom=560;edge=1;z=18}; edit13={cls="edit";text="0";left=384;top=568;right=440;bottom=601;edge=1;z=19}; edit14={cls="edit";text="0";left=455;top=569;right=511;bottom=602;edge=1;z=20}; edit15={cls="edit";text="0";left=385;top=616;right=441;bottom=649;edge=1;z=21}; edit16={cls="edit";text="0";left=457;top=615;right=513;bottom=648;edge=1;z=16}; edit2={cls="edit";text="0";left=86;top=480;right=142;bottom=513;edge=1;z=7}; edit3={cls="edit";text="0";left=14;top=524;right=70;bottom=557;edge=1;z=9}; edit4={cls="edit";text="0";left=85;top=523;right=141;bottom=556;edge=1;z=10}; edit5={cls="edit";text="0";left=13;top=564;right=69;bottom=597;edge=1;z=11}; edit6={cls="edit";text="0";left=84;top=565;right=140;bottom=598;edge=1;z=12}; edit7={cls="edit";text="0";left=14;top=612;right=70;bottom=645;edge=1;z=13}; edit8={cls="edit";text="0";left=86;top=611;right=142;bottom=644;edge=1;z=8}; edit9={cls="edit";text="0";left=385;top=491;right=441;bottom=524;edge=1;z=15}; static={cls="static";text="Static";left=0;top=0;right=760;bottom=424;transparent=1;z=2} ) /*}}*/ import console console.open() var ew = winform.static.createEmbed("EWDRAW.EWDrawCtrl.1") var EWdraw1 = ew._object winform.button.oncommand = function(id,event){ EWdraw1.SetGridValue( 5, 5, 100, 100, 0) EWdraw1.SetGridOn( true) } winform.button2.oncommand = function(id,event){ //EWdraw1.SetDisplayToolBar(true) var a = com.SafeArrayV({0;0;0}); var b = com.SafeArrayV({5;5;0}); console.log( EWdraw1.Line(a,b) ) } winform.button3.oncommand = function(id,event){ var a = com.SafeArrayV({0;0;0}); var b = com.SafeArrayV({0;0;1}); console.log( EWdraw1.Circle(a,20,b) ) } winform.button4.oncommand = function(id,event){ p1 = com.SafeArrayV({winform.edit1.text;winform.edit2.text;0}); p2 = com.SafeArrayV({winform.edit3.text;winform.edit4.text;0}); p3 = com.SafeArrayV({winform.edit5.text;winform.edit6.text;0}); p4 = com.SafeArrayV({winform.edit7.text;winform.edit8.text;0}); EWdraw1.Line(p1,p2) EWdraw1.Line(p2,p3) EWdraw1.Line(p3,p4) EWdraw1.Line(p4,p1) } jisuan = function(x,y,angle){ var xx = x*math.cos(math.rad(angle)) - y*math.sin(math.rad(angle)); var yy = x*math.sin(math.rad(angle)) + y*math.cos(math.rad(angle)); return com.SafeArrayV({xx; yy;0}),xx,yy; } winform.button6.oncommand = function(id,event){ d1,winform.edit9.text,winform.edit10.text = jisuan(winform.edit1.text,winform.edit2.text,winform.edit.text); d2,winform.edit11.text,winform.edit12.text = jisuan(winform.edit3.text,winform.edit4.text,winform.edit.text); d3,winform.edit13.text,winform.edit14.text = jisuan(winform.edit5.text,winform.edit6.text,winform.edit.text); d4,winform.edit15.text,winform.edit16.text = jisuan(winform.edit7.text,winform.edit8.text,winform.edit.text); } winform.button5.oncommand = function(id,event){ EWdraw1.Line(d1,d2) EWdraw1.Line(d2,d3) EWdraw1.Line(d3,d4) EWdraw1.Line(d4,d1) } winform.show(); win.loopMessage();
登录后方可回帖
借鉴相关文章, https://blog.csdn.net/mzl87/article/details/104407393
已知P(X,Y) 如果旋转θ角度, 那么旋转后点为: P'(X',Y')
在aardio中表达式为:
下面是角度为90°时候图片
45°时候: