在界面上动态显示出哈夫曼树及其生成过程 Javascript 源代码.docx
《在界面上动态显示出哈夫曼树及其生成过程 Javascript 源代码.docx》由会员分享，可在线阅读，更多相关《在界面上动态显示出哈夫曼树及其生成过程 Javascript 源代码.docx（187页珍藏版）》请在冰豆网上搜索。
在界面上动态显示出哈夫曼树及其生成过程Javascript源代码
在界面上显示出哈夫曼树及其生成过程的Javascript源代码：
Index：
varHuaffman={
gloable:
7000,
data:
[],//输入的权值存放数组
numdivList:
[],//把生成的圆存放到该数组
cxt:
document.getElementById（"showCanvas"）.getContext（"2d"）,
cxt2:
document.getElementById（"mapCanvas"）.getContext（"2d"）,
timer:
0,
oldnumdivList:
[],//右边圆的存放位置
nextnumdivList:
[],//
donenumdivList:
[],//用来存放parentBox实例
lineList:
[],
mapList:
[],
allCanvas:
[],//
newData:
null,//两权值相加后的数值
level:
0,//
init:
function（）{
this.initMap（）;
},
initMap:
function（）{//生成地图
for（vari=0;ivarmapX=[];
for（varj=0;j<26;j++）{
varnewMap=newMap（this.cxt2,25+j*40,30+i*40,20,"rgba（0,0,0,0）"）;
mapX.push（newMap）;
}
this.mapList.push（mapX）;
}
drawMap（）;
},
initData:
function（）{//取到输入权值
varme=this;
me.data=$（"#inputValue"）.val（）.split（","）.sort（function（a,b）{returna-b}）;
//console.log（me.data.length）
me.initDiv（）;
},
initDiv:
function（）{
this.clear（）;
this.numdivList=[];
this.lineList=[];
this.oldnumdivList=[];
this.donenumdivList=[];
for（vari=0;ivarnumDiv=newNumdiv（this.cxt,this.data[i],25,i,String.fromCharCode（i+65））;//初始化一个圆
this.numdivList.push（numDiv）;
this.oldnumdivList.push（numDiv）;
}
//this.oldnumdivList.sort（function（a,b）{returnparseInt（a.data）-parseInt（b.data）;}）;
drawNumdiv（）;
},
addData:
function（data1,data2）{
this.oldnumdivList.shift（）;
this.oldnumdivList.shift（）;
this.newData=parseInt（data1.data）+parseInt（data2.data）;
if（this.data.length==this.oldnumdivList.length+2）{
data1.nextPosition={cols:
5,level:
15};
data2.nextPosition={cols:
7,level:
15};
this.nowList=newParentBox（newDate（）.getTime（）,null,[data1,data2],[],0,0）;
this.donenumdivList.push（this.nowList）;//把生成的树放到这个数组
}else{
this.donenumdivList.sort（function（a,b）{returna.headNode.cols-b.headNode.cols;}）;//生成的树按位置排序
if（!
data1.tag&&data2.tag）{
for（vari=0;iif（this.donenumdivList[i].id==data1.parentId）{
this.nowList=this.donenumdivList[i];//确认了生成的父节点位置的树，并把它赋给nowList
}else{
this.donenumdivList[i].changeCols=0;
}
}
data1.nextPosition={cols:
this.nowList.headNode.cols,level:
this.nowList.headNode.level};
data2.nextPosition={cols:
this.nowList.children[this.nowList.children.length-1].cols+1,level:
this.nowList.headNode.level};
this.nowList.children.push（this.nowList.headNode）;
this.nowList.children.push（data2）;
this.nowList.sortChildren（）;
setTimeout（function（）{
Huaffman.numdivList.remove（data1）;
//Huaffman.nowList.changeCols=-1;//
updateParentBox（）;//重新
},Huaffman.gloable*3/14）;
}elseif（data1.tag&&!
data2.tag）{
for（vari=0;iif（this.donenumdivList[i].id==data2.parentId）{
this.nowList=this.donenumdivList[i];
}else{
this.donenumdivList[i].changeCols=0;
}
}
data2.nextPosition={cols:
this.nowList.headNode.cols,level:
this.nowList.headNode.level};
data1.nextPosition={cols:
this.nowList.children[0].cols-1,level:
this.nowList.headNode.level};
Huaffman.nowList.children.push（Huaffman.nowList.headNode）;
Huaffman.nowList.children.push（data1）;
Huaffman.nowList.sortChildren（）;
setTimeout（function（）{
Huaffman.numdivList.remove（data2）;
//Huaffman.nowList.changeCols=1;
updateParentBox（）;
},Huaffman.gloable*3/14）;
}elseif（data1.tag&&data2.tag）{
vararr=[];
varnewData=parseInt（data1.data）+parseInt（data2.data）;
for（vari=0;iif（parseInt（this.donenumdivList[i].headNode.data）<=newData）{
arr.push（this.donenumdivList[i]）;
}else{
this.donenumdivList[i].changeCols=0;
}
}
if（arr.length）{
arr[arr.length-1].sortChildren（）;
this.nowList=newParentBox（newDate（）.getTime（）,null,[data1,data2],[],0,0）;
this.donenumdivList.push（this.nowList）;
data1.nextPosition={cols:
arr[arr.length-1].children[arr[arr.length-1].children.length-1].cols+1,level:
arr[arr.length-1].headNode.level+2};
data2.nextPosition={cols:
arr[arr.length-1].children[arr[arr.length-1].children.length-1].cols+3,level:
arr[arr.length-1].headNode.level+2};
setTimeout（function（）{
Huaffman.nowList.changeCols=-3;
for（vari=0;iarr[i].changeCols=-3;
updateParentBox（）;
}
},Huaffman.gloable*3/14）;
}else{
arr[0].sortChildren（）;
Huaffman.nowList=newParentBox（newDate（）.getTime（）,null,[data1,data2],[],0,0）;
Huaffman.donenumdivList.push（Huaffman.nowList）;
data1.nextPosition={cols:
arr[0].children[0].cols-1,level:
arr[0].headNode.level+2};
data2.nextPosition={cols:
arr[0].children[0].cols-3,level:
arr[0].headNode.level+2};
setTimeout（function（）{
for（vari=0;iHuaffman.donenumdivList[i].changeCols=3;
updateParentBox（）;
}
},Huaffman.gloable*3/14）;
}
}elseif（!
data1.tag&&!
data2.tag）{
varobj1={},obj2={};
for（vari=0;ithis.donenumdivList[i].changeCols=0;
if（this.donenumdivList[i].id==data1.parentId）{
obj1=this.donenumdivList[i];
}elseif（this.donenumdivList[i].id==data2.parentId）{
obj2=this.donenumdivList[i];
}
}
varchildrenArr=obj1.children.concat（obj2.children）;
varlineArr=obj1.lineList.concat（obj2.lineList）;
childrenArr.push（obj1.headNode）;
childrenArr.push（obj2.headNode）;
this.nowList=newParentBox（newDate（）.getTime（）,null,childrenArr,lineArr,0,0）;
this.donenumdivList.push（this.nowList）;
this.donenumdivList.remove（obj1）;
this.donenumdivList.remove（obj2）;
data2.nextPosition={cols:
obj2.headNode.cols,level:
obj2.headNode.level};
data1.nextPosition={cols:
obj1.headNode.cols,level:
obj1.headNode.level};
Huaffman.nowList.sortChildren（）;
setTimeout（function（）{
Huaffman.numdivList.remove（data1）;
Huaffman.numdivList.remove（data2）;
},Huaffman.gloable*3/14）;
}
}
setTimeout（function（）{Huaffman.addDiv（data1,data2）;},50）;
setTimeout（function（）{
varminCols=9999;
for（vari=0;iHuaffman.donenumdivList[i].changeCols=0;
Huaffman.donenumdivList[i].changeLevel=0;
Huaffman.donenumdivList[i].sortChildren（）;
}
for（vari=0;iif（Huaffman.donenumdivList[i].children[0].colsminCols=Huaffman.donenumdivList[i].children[0].cols;
}
}
vararrCols=Huaffman.donenumdivList.sort（function（a,b）{returna.headNode.cols-b.headNode.cols;}）;
vararrLevel=Huaffman.donenumdivList.sort（function（a,b）{returna.headNode.level-b.headNode.level;}）;
vararrData=Huaffman.donenumdivList.sort（function（a,b）{
if（parseInt（a.headNode.data）==parseInt（b.headNode.data））{
return1;
}else{
returnparseInt（a.headNode.data）-parseInt（b.headNode.data）;
}
}）;
varhighLevel=arrLevel[arrLevel.length-1].headNode.level;
if（highLevel<=2）{highLevel=2};
varleftCols=minCols;
if（leftCols<=2）{leftCols=2}elseif（leftCols>=23）{leftCols=23};
for（vari=0;iif（i==0）{
Huaffman.donenumdivList[0].changeCols=leftCols-Huaffman.donenumdivList[0].children[0].cols;
Huaffman.donenumdivList[0].changeLevel=highLevel-Huaffman.donenumdivList[0].headNode.level;
}else{
varwidthCols=0;
for（varj=0;jwidthCols+=parseInt（Huaffman.donenumdivList[j].children[Huaffman.donenumdivList[j].children.length-1].cols-Huaffman.donenumdivList[j].children[0].cols+1）;
}
Huaffman.donenumdivList[i].changeCols=leftCols+widthCols-Huaffman.donenumdivList[i].children[0].cols;
Huaffman.donenumdivList[i].changeLevel=highLevel-Huaffman.donenumdivList[i].headNode.level;
}
}
updateParentBox（）;
},Huaffman.gloable*3/14）;
},
addDiv:
function（data1,data2）{
clearTimeout（timer）;
if（!
data1.isStart&&!
data2.isStart）{
this.newnumDiv=newNumdiv（this.cxt,this.newData,parseInt（（data1.cols+data2.cols）/2）,data1.level-2,null）;
this.newLineLeft=newLine（this.cxt,data1.cols,data1.level,this.newnumDiv.cols,this.newnumDiv.level,"#ccc",3）;
this.newLineRight=newLine（this.cxt,data2.cols,data2.level,this.newnumDiv.cols,this.newnumDiv.level,"#ccc",3）;
this.lineList.push（this.newLineLeft）;
this.lineList.push（this.newLineRight）;
this.numdivList.push（this.newnumDiv）;
this.newnumDiv.parentId=this.nowList.id;
this.nowList.lineList.push（this.newLineLeft）;
this.nowList.lineList.push（this.newLineRight）;
this.nowList.headNode=this.newnumDiv;
setTimeout（function（）{Huaffman.returnData（）;},Huaffman.gloable*3/14）;
}else{
vartimer=setTimeout（function（）{Huaffman.addDiv（data1,data2）;},Huaffman.gloable/140）;
}
},
returnData:
function（）{
this.backnumDiv=newNumdiv（this.cxt,this.newData,this.newnumDiv.cols,this.newnumDiv.level,null）;
this.backnumDiv.parentId=this.nowList.id;
this.numdivList.push（this.backnumDiv）;
if（parseInt（this.oldnumdivList[this.oldnumdivList.length-1].data）<=parseInt（this.backnumDiv.data））{
for（vari=0;ivarthisLevel=this.oldnumdivList[i].level-1;
this.oldnumdivList[i].nextPosition={cols:
this.oldnumdivList[i].cols,level:
thisLevel};
}
this.backnumDiv.nextPosition={cols:
25,level:
this.oldnumdivList[this.oldnumdivList.length-1].level};
this.oldnumdivList.push（this.backnumDiv）;
//this.oldnumdivList.sort（function（a,b）{returna.
升级会员 