⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 bode_ms_vml.htm

📁 在网页上画波特图
💻 HTM
字号:
<html xmlns="http://w3.org/1999/xhtml" xml:lang="en"
	xmlns:v="urn:schemas-microsoft-com:vml">
<style>
	v\:*{Behavior:url(#default#VML)}
	.platstyle{
		position:relative;
		width:800px;
		height:400px;
		background-color:#000000;
	}
	input{
		font-size:12px;
		border-right: #7B828C 1px solid;
		border-top: #7B828C 1px solid;
		border-left: #7B828C 1px solid;
		border-bottom: #7B828C 1px solid;
	}
	body{	
		margin-left:auto;
		margin-right:auto;
		width:800px;
		text-aglin:center;
	}
	.gridstyle{
		position:absolute;
	}
</style>
<!--
	/*
		visibility:hidden;
body {text-align:center;}
.main{margin-left:auto;margin-right:auto;width:800px;text-align:left;}
*/


 width,Height:the Platform's width & Height
 
 -->
<title>Matrix Exercise - Power By VML</title>
<body>
<!--<h3>Enjoy Yourself</h3><hr/>
-->
Num1<input type="text" id="txt_Num1" name="txt_Num1" value="1,4,2,8,5,7"/>
Num2<input type="text" name="txt_Num2" value="4,5,9"/>
Num:<input type="text" name="txt_Num" value="2"/>
<hr/>
Den1<input type="text"name="txt_Den1"value="3,1,4"/>
Den2<input type="text"name="txt_Den2"value="1,0,5"/>
Den:<input type="text"name="txt_Den"value="1,3,2,2"/><br/>

<input type="button"name="btn_conv"value="Conv"onclick="ConvOut()"/>
<input type="button"name="btn_cls"value="Clear Screen"onclick="Clean(board)"/>
<input type="button"name="btn_done"value="Done!"onclick="DoSomething()"/>
<hr/>
<div id="plat"class="platstyle">
<!--Generate by:DrawGrid();
function DrawGrid(){
	var log10=Math.log(10)
	for(var j=0;j<8;j++){
		for(var i=2;i<=10;i+=2){
			var GridX=((Math.log(i)/log10)+j)*100
			DrawLine(plat,GridX,400-0,GridX,400-400)//the plat there change to Girds
		}
	}
	for(var i=0;i<4;i++){
				DrawLine(plat,0,400-i*100,800,400-i*100)
	}
}
-->
	<div id="grids" class="gridstyle" >
<v:line from="30,400" to="30,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="60,400" to="60,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="78,400" to="78,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="90,400" to="90,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="100,400" to="100,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="130,400" to="130,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="160,400" to="160,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="178,400" to="178,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="190,400" to="190,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="200,400" to="200,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="230,400" to="230,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="260,400" to="260,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="278,400" to="278,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="290,400" to="290,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="300,400" to="300,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="330,400" to="330,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="360,400" to="360,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="378,400" to="378,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="390,400" to="390,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="400,400" to="400,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="430,400" to="430,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="460,400" to="460,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="478,400" to="478,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="490,400" to="490,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="500,400" to="500,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="530,400" to="530,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="560,400" to="560,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="578,400" to="578,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="590,400" to="590,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="600,400" to="600,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="630,400" to="630,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="660,400" to="660,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="678,400" to="678,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="690,400" to="690,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="700,400" to="700,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="730,400" to="730,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="760,400" to="760,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="778,400" to="778,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="790,400" to="790,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="800,400" to="800,0"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="0,400" to="800,400"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="0,300" to="800,300"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="0,200" to="800,200"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<v:line from="0,100" to="800,100"><v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>
<!--End Generate by:DrawGrid();-->


	<v:polyLine id="poly1" filled=f strokecolor=red strokeweight=1.5pt points=""/><!--style="visibility:hidden" -->
	<v:polyLine id="poly2" style="visibility:hidden" filled=f strokecolor=red strokeweight=1.5pt points=""/>
	<v:polyLine id="poly3" style="visibility:hidden" filled=f strokecolor=red strokeweight=1.5pt points=""/>


	</div>
<div id="board"></div>
</div>
<textarea  name="txt_debuger" cols=95 rows=6 wrap="VIRTUAL" ></textarea>

<v:group ID="group1" style="WIDTH:500pt;HEIGHT:300pt;" coordsize="5000,3000">

<v:line from="0,0" to="100,200" LineStyle="ThinThick" dashstyle="Dash" Color="#00FF00" StartArrow="classic" EndArrow="Classic"   stroke="true"
  strokecolor="red"
/>

		<v:line from="200,100" to="200,2800" style="Z-INDEX:8;POSITION:absolute" strokeweight="1pt">
		<v:stroke StartArrow="classic"/>
		</v:line>
		<v:line from="200,2800" to="4800,2800" style="Z-INDEX:8;POSITION:absolute" strokeweight="1pt">
		<v:stroke EndArrow="classic"/>
		</v:line>
<!--
		<v:rect style="WIDTH:4900px;HEIGHT:3000px" coordsize="21600,21600" fillcolor="white" strokecolor="black">
		<v:shadow on="t" type="single" color="silver" offset="4pt,3pt"></v:shadow>
		</v:rect>
-->
		<v:polyLine id="poly1" style="visibility:hidden;z-index:9" filled=f strokecolor=red strokeweight=1.5pt points="212,2132 245,2429 278,2355 308,2355 341,2169 2390,2318 2420,2392 2453,2503 2516,2578 2549,2243 2582,2429 2612,2355 2645,2392 2678,2503 2708,2429 2741,2058 2804,2280 2837,2355 2870,2355 2900,2206 2966,2243 2996,2355 3029,2392 3062,1798 3092,1278 3125,1315 3158,1575 3188,1835 3221,1092 3254,906 3284,720 3317,1686 3350,1463 3380,1129 3413,758 3446,1129 3476,795 3509,1352 3542,1166 3572,1426 3605,646 3638,1352 3668,1315 3701,1389 3734,1760 3764,943 3797,1500 3830,1798 3860,1835 3893,1686 3926,1649 3956,1426 4022,1426"/>
</v:group>
<line
  from="0 0"
  to="100 100"
  style='visibility: visible'
  opacity="1.0"
  chromakey="null"
  stroke="true"
  strokecolor="red"
  strokeweight="1"
  fill="true"
  fillcolor="blue"
  coordsize="1000,1000"
  coordorigin="0 0"
/>

<script defer="true">
var Num1,Den1,Num2,Den2
var Num,Den
var temp
var girds
function VirtualNum(x,j){
	this.x=x;this.j=j
} //虚数
/*
function DrawLine(v_div,x1,y1,x2,y2){
	var s=""
	s=s+'<v:line '
	s=s+'from="'+Math.round(x1)+','+Math.round(y1)+ '" to="'+Math.round(x2)+','+Math.round(y2)+ '">'
	s=s+'<v:stroke LineStyle="ThinThick" dashstyle="Dash" Color="#D0D0D0"/></v:line>\n'
	v_div.innerHTML+=s
	txt_debuger.value+=s
}
function DrawGrid(){
	var log10=Math.log(10)
	for(var j=0;j<8;j++){
		for(var i=2;i<=10;i+=2){
			var GridX=((Math.log(i)/log10)+j)*100
			DrawLine(plat,GridX,400-0,GridX,400-400)
		}
	}
	for(var i=0;i<4;i++){
				DrawLine(plat,0,400-i*100,800,400-i*100)
	}
}
*/
function tmp_DrawLine(v_div,x1,y1,x2,y2){
	var s=""
	s=s+'<v:line '
	s=s+'from="'+Math.round(x1)+','+Math.round(y1)+ '" to="'+Math.round(x2)+','+Math.round(y2)+ '">'
	s=s+'<v:stroke LineStyle="ThinThick" dashstyle="Solid" Color="#FFFFFF" />'
	v_div.innerHTML+=s
	//txt_debuger.value+=s
}

//function Draw(
function VirtualDiv(v1,v2){
	var mother=v1.x*v1.x-v2.x*v2.x
	var rc=new VirtualNum(0,0)
	rc.x=(v1.x*v2.x-v1.j*v2.j)/mother
	rc.j=(v2.x*v1.j-v1.x*v2.j)/mother
	//txt_debuger.value+="VirtualDiv:"+rc.x+"+j"+rc.j+"\n" //"v2="+v2.x+"+j"+v2.j+"\n"
	return  rc
	/*
		v1x+v1j v2x-v2j
		//vx2+vj2
	*/
}
function Array2Virtual(arr,omega){
	var v=new VirtualNum(0,0)
	var v_arr=arr
	var t
	var l=v_arr.length
	for(var i=0;i<l;i++){
		t=i%4
		switch(t){
			case 0:
				v.x+=Math.pow(omega,i)*v_arr[i];
				break;
			case 1:
				v.j+=Math.pow(omega,i)*v_arr[i];
				break;
			case 2:
				v.x-=Math.pow(omega,i)*v_arr[i];
				break;
			case 3:
				v.j-=Math.pow(omega,i)*v_arr[i];
				break;
		}
	}
	return v
}
function VirtualFromArrayDiv(arr_a,arr_b,omega){
	var v1=Array2Virtual(arr_a,omega)
	var v2=Array2Virtual(arr_b,omega)
	return VirtualDiv(v1,v2)

}
function conv(arr_a,arr_b){
	var arr_c=new Array()
	for(var i=0;i<arr_b.length;i++){
		for(var j=0;j<arr_a.length;j++){
			if(isNaN(arr_c[i+j])) arr_c[i+j]=0
			arr_c[i+j]+=arr_a[j]*arr_b[i]
			if(isNaN(arr_c[i+j])) arr_c[i+j]=0
		}
	}
	return arr_c
}
function ConvOut(){
		InitData()
		Num=conv(Num1,Num2)
		Den=conv(Den1,Den2)
		txt_Num.value=Num.reverse().join(",");Num.reverse()
		txt_Den.value=Den.reverse().join(",");Den.reverse()
		txt_debuger.value+="Num:"+Num.join(',')+" Den:"+Den.join(",")+"\n"
}
function InitData(){
	Num1=txt_Num1.value.split(",").reverse()
	Den1=txt_Den1.value.split(",").reverse()
	Num2=txt_Num2.value.split(",").reverse()
	Den2=txt_Den2.value.split(",").reverse()
	Num=txt_Num.value.split(",").reverse()
	Den=txt_Den.value.split(",").reverse()
}
function DoSomething(){
	var log10=Math.log(10)
	InitData()
	if((txt_Num.value.length==0)||(txt_Den.value.length==0)){
		ConvOut()
		alert("ConvOut");
	}
	btn_done.disabled=true;//"disabled"
	alert("过程比较长 请等待至少10秒");
	//todo: 如果 0==Den || 0==num return Err
	var oldy=0
	for(var i=0;i<=800;i+=10){
		var omega=Math.pow(10,(i-100)/100)
		var v=VirtualFromArrayDiv(Num,Den,omega)
		var n=10*Math.log(v.x*v.x+v.j*v.j)/log10
		txt_debuger.value+=n+"\n"
		tmp_DrawLine(board,i-10,400-(oldy+200),i,400-(n+200))
		oldy=n
	}
	
	btn_done.disabled=false;
}
function Clean(v_div){
	v_div.innerHTML=""
}
</script>

</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -