1、,by 郭冬冬,北京宏景世紀(jì)軟件有限公司,yFiles Ajax開發(fā)說明,yFiles Ajax介紹,yFiles Ajax是一款基于dojo js框架 和 java 的頁面繪圖展示工具，生成的頁面風(fēng)格比較漂亮，操作比較方便。,官網(wǎng)demo：,yFiles Ajax 開始,1.熟悉Dojo Toolkit框架基礎(chǔ)知識及組件使用。 2.新建web工程，加入依賴jar包。（batik.jar、y.jar、yfiles-ajax.jar、ysvg.jar） 3.工程中加入文件：,*javascript:依賴js文件 resources:依賴樣式文件 web.xml:內(nèi)置servlet（不可去掉） y

2、files-ajax-liscense.xml（秘鑰）,yFiles Ajax 開始,resources文件夾下新建graphs文件夾，并將需要顯示的.graphml文件復(fù)制進(jìn)去。,*graphml格式的文件類似于svg文件，以xml格式存放圖形元素屬性、位置等信息 （此文件必須放置在/resource/graphs/目錄下，程序默認(rèn)）,yFiles Ajax 開始,4.web.xml,*內(nèi)置servlet，不可刪除。否則 控件將無法使用,yFiles Ajax 開始,5.客戶端,1.根目錄下新建helloyFiles.jsp文件，引入js文件，并添加dojo組件：,*path屬性：頁面加載時

3、會從session中查找key為“computers.graphml”的對象(Graph2D)顯示，如果沒有，則會去/resources/graphs/目錄下讀取名字為“computers.graphml”的文件。,yFiles Ajax 開始,6.訪問helloyFiles.jsp頁面：,此處顯示的即為resources/graphs下的computer.graphml,結(jié)構(gòu)：,基本類型介紹,服務(wù)器端： Graph2D 繪圖對象 BaseServlet 封裝了一系列對Graph2D類的操作方法。 Node 節(jié)點(diǎn)對象 GenericNodeRealizer 節(jié)點(diǎn)格式、樣式對象 Edge 連接線

4、對象 GenericEdgeRealizer 連接線格式、樣式對象 Label 節(jié)點(diǎn)文字、圖片對象 Layouter 展現(xiàn)形式對象（橫向、縱向等） 客戶端： yfiles.client.tiles.widget.GraphCanvas dojo組件用于展示Graph2D,yFiles Ajax 開發(fā),新建servlet類GetNewGraphServlet.java，繼承BaseServlet：,yFiles Ajax 開發(fā),繪制自己的圖形界面,web.xml添加servlet：,yFiles Ajax 開發(fā),修改helloyFiles.jsp:,yFiles Ajax 開發(fā),重新訪問helloyFiles.jsp:,yFiles Ajax 開發(fā),為節(jié)點(diǎn)添加屬性、樣式（NodeRealizer）,yFiles Ajax 開發(fā),*節(jié)點(diǎn)的圖形、陰影、過度色等都是由painter生成的，不同的painter會有不同的效果,為節(jié)點(diǎn)添加屬性、樣式,yFiles Ajax 開發(fā),Edge對象,yFiles Ajax 開發(fā),Layouter布局,yFiles Ajax 開發(fā),事件綁定,yFiles Ajax 開發(fā),點(diǎn)擊節(jié)點(diǎn)添加下級節(jié)點(diǎn),yFiles Ajax 開發(fā),服務(wù)器端操作Graph2D常用方法,yFiles Ajax 開發(fā),客戶端常用方法,謝 謝！,北京