基于vml生成web統(tǒng)計圖表的研究與實現(xiàn)論文_第1頁
基于vml生成web統(tǒng)計圖表的研究與實現(xiàn)論文_第2頁
基于vml生成web統(tǒng)計圖表的研究與實現(xiàn)論文_第3頁
基于vml生成web統(tǒng)計圖表的研究與實現(xiàn)論文_第4頁
基于vml生成web統(tǒng)計圖表的研究與實現(xiàn)論文_第5頁
已閱讀5頁,還剩40頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)

文檔簡介

1、.PAGE :.;梧 州 學(xué) 院畢 業(yè) 論 文 論文標題 基于VML生成WEB統(tǒng)計圖表 的研討與實現(xiàn) 系 別 計算機與電子信息工程系 專 業(yè) 計算機科學(xué)與技術(shù) 班 級 學(xué) 號 學(xué)生姓名 指點教師簽名 完成時間 年 月摘要 計算機圖形學(xué)是計算機科學(xué)最活潑的分支之一,它伴隨著計算機科學(xué)技術(shù)的開展而開展。如今,計算機圖形學(xué)曾經(jīng)深深的扎根于現(xiàn)代社會的各個方面,被廣泛運用于計算機動畫、科學(xué)計算可視化、CAD/CAM、影視文娛等領(lǐng)域。VML是一門全新的圖形編程言語, 相當于IE里面的畫筆,而且結(jié)合腳本,可以讓圖形產(chǎn)生動態(tài)的效果,同時也是未來D網(wǎng)頁制造的主要編程言語之一。本文經(jīng)過基于VML生成WEB統(tǒng)計圖表

2、的研討與實現(xiàn),著重論述了如何利用VML言語實如今線繪制幾何矢量圖形并實現(xiàn)圖形算法。本文首先對Web圖表開發(fā)主要的GML、SVG、VML這三種言語進展比較,然后運用IE .提供的VML解析器,闡明VML的根本語法,討論運用VML等技術(shù)實現(xiàn)Web圖形系統(tǒng)的能夠性,同時給出了一些原型實例。關(guān)鍵詞: 矢量圖形 VML 動態(tài)腳本 The research and achievement about the VML language to create spatial web chartAbstractWith the development of computer technology, compute

3、r graphic is a branch of one the most active science. Today computer graphic has been deeply rooted in all aspects of modern society and is widely used in animation, scientific visualization, CAD/CAM, video detainment, and other fields.The VML language is a new graphic program. It s a marking progra

4、m language like a paint or on IE and only can be carried out by IE. as well as up of . edition. You can draw sketches that you want and get the sketch dynamic result.To create the spatial web chart. GML、SVG、VML are compared firstly. Some basic semantics are explained by u sing the VML render provide

5、d by IE ., and possibility of using VML and other techniques to implement Web graphic system is researched. At the same time, some pro type examples are given.Key words: vector graphics vector markup language dynamical scripts目錄 TOC o - h z u HYPERLINK l _Toc 第一章 前言 PAGEREF _Toc h HYPERLINK l _Toc .

6、 研討的背景 PAGEREF _Toc h HYPERLINK l _Toc . 研討的目的 PAGEREF _Toc h HYPERLINK l _Toc . 研討的內(nèi)容 PAGEREF _Toc h HYPERLINK l _Toc 第二章 可行性研討分析 PAGEREF _Toc h HYPERLINK l _Toc . Web數(shù)據(jù)庫運用系統(tǒng) PAGEREF _Toc h HYPERLINK l _Toc . Web信息系統(tǒng)的開展 PAGEREF _Toc h HYPERLINK l _Toc . Web圖表開發(fā)運用言語的定義 PAGEREF _Toc h HYPERLINK l _To

7、c . 基于GML、SVG、VML這三種言語的比較 PAGEREF _Toc h HYPERLINK l _Toc 第三章 目前的主要技術(shù) PAGEREF _Toc h HYPERLINK l _Toc . HTML與ASP的結(jié)合 PAGEREF _Toc h HYPERLINK l _Toc . VML言語 PAGEREF _Toc h HYPERLINK l _Toc 第四章VML的根本用法 PAGEREF _Toc h HYPERLINK l _Toc . VML根本語法 PAGEREF _Toc h HYPERLINK l _Toc . VML的常用標志 PAGEREF _Toc h

8、HYPERLINK l _Toc . 圖形與圖像算法在VML中的實現(xiàn) PAGEREF _Toc h HYPERLINK l _Toc . ASP結(jié)合VML動態(tài)開發(fā)原理 PAGEREF _Toc h HYPERLINK l _Toc 第五章 程序?qū)崿F(xiàn) PAGEREF _Toc h HYPERLINK l _Toc .義務(wù)概述 PAGEREF _Toc h HYPERLINK l _Toc .用戶的特點 PAGEREF _Toc h HYPERLINK l _Toc .需求規(guī)定 PAGEREF _Toc h HYPERLINK l _Toc . Web統(tǒng)計圖表的實現(xiàn): PAGEREF _Toc h

9、 HYPERLINK l _Toc . Web統(tǒng)計圖表的開發(fā)與設(shè)計: PAGEREF _Toc h HYPERLINK l _Toc . 運轉(zhuǎn)環(huán)境規(guī)定 PAGEREF _Toc h HYPERLINK l _Toc . 實現(xiàn)程序?qū)嵗?PAGEREF _Toc h HYPERLINK l _Toc . VML網(wǎng)頁畫圖畫板: PAGEREF _Toc h HYPERLINK l _Toc .學(xué)生選課投票統(tǒng)計:D餅型圖轉(zhuǎn)換為D柱型圖 PAGEREF _Toc h HYPERLINK l _Toc .電壓合格率實時曲線走勢圖:D曲線圖 PAGEREF _Toc h HYPERLINK l _Toc

10、. web綜合圖表的實現(xiàn)ASP+VML的結(jié)合: PAGEREF _Toc h HYPERLINK l _Toc 第六章 總結(jié)與展望 PAGEREF _Toc h HYPERLINK l _Toc . 總結(jié) PAGEREF _Toc h HYPERLINK l _Toc . 展望 PAGEREF _Toc h HYPERLINK l _Toc 參考文獻 PAGEREF _Toc h HYPERLINK l _Toc 附錄 PAGEREF _Toc h HYPERLINK l _Toc 致謝 PAGEREF _Toc h 第一章 前言. 研討的背景隨著Internet信息系統(tǒng)逐漸向Web的遷移和基

11、于Web的電子商務(wù)系統(tǒng)的開展,Web設(shè)計和開發(fā)人員曾經(jīng)越來越將留意力集中到Web運用程序上,而非最初的Web內(nèi)容創(chuàng)作和編輯排版。Web運用程序更關(guān)注的是數(shù)據(jù)以及如何將數(shù)據(jù)抽取成信息、將信息轉(zhuǎn)化成知識以為管理提供協(xié)助 。管理者需求以更直觀、更籠統(tǒng)的可視化方式將數(shù)據(jù)抽取為信息,然后根據(jù)本人的了解將信息轉(zhuǎn)化成知識。Web圖表是一種很好的將對象屬性數(shù)據(jù)直觀、籠統(tǒng)地“可視化的手段??梢暬疺isualization技術(shù)使得人們可以在三維圖形世界中直接對具有形體的信息進展操作,和計算機直接交流。這種技術(shù)曾經(jīng)把人和機器的力量以一種直覺而自然的方式加以一致,這種革命性的變化無疑將極大地提高人們的任務(wù)效率??梢暬?/p>

12、技術(shù)賦予人們一種仿真的、三維的并且具有實時交互的才干,這樣人們可以在三維圖形世界中用以前不可想象的手段來獲取信息或發(fā)揚本人發(fā)明性的思想。計算機圖形學(xué)是計算機科學(xué)領(lǐng)域中的一個重要而又年輕的學(xué)科,它是隨著計算機硬件特別是圖形顯示設(shè)備的開展而逐漸產(chǎn)生開展起來的。隨著計算機網(wǎng)絡(luò)的不斷開展,圖形圖像更多的在Web中運用,由于用圖形圖像表達各種信息,其容量大、直觀方便,更符合人們察看了解事物運動規(guī)律的習慣,研討實現(xiàn)Web統(tǒng)計圖表尤為適宜人們的需求。目前,計算機圖形學(xué)在工業(yè)、商業(yè)、軍事、教育和影視文娛等各個領(lǐng)域得到了廣泛運用,已成為計算機科學(xué)中開展最快、影響最大的學(xué)科之一,并在運用中日益顯示出其重要性和不可

13、替代性。所以,圖形圖像的研討必將在許多科學(xué)領(lǐng)域內(nèi)有其深遠的影響和意義。. 研討的目的本次研討是基于VML言語生成Web統(tǒng)計圖表的研討與實現(xiàn),深化研討實現(xiàn)Web統(tǒng)計圖表技術(shù),分析VML與其他技術(shù)比較所具備的優(yōu)點,討論Web圖表的根本實際和設(shè)計原那么,并給出詳細的實現(xiàn)方法,使得用戶和管理者對VML言語生成Web統(tǒng)計圖表的廣泛運用有比較深化的認識。作為一門專業(yè)的Web繪圖編程言語VML(The Vector Markup Language)矢量可標志言語是微軟公司于年月附帶IE.發(fā)布的。這是一門全新的圖形編程言語,雖然目前業(yè)界關(guān)注的人士比較少但隨著Web運用的不斷開展,這種以文本方式存儲圖形的標志言

14、語已呈現(xiàn)出它不可抵擋的優(yōu)勢和魅力。它相當于IE里面的畫筆,而且結(jié)合腳本,可以讓圖形產(chǎn)生動態(tài)的效果,同時也是未來D網(wǎng)頁制造的主要編程言語之一。Web 數(shù)據(jù)庫運用系統(tǒng)中 ,有時需求有一些統(tǒng)計數(shù)據(jù)圖形給用戶傳達準確 、直觀的數(shù)據(jù)信息 。利用 HTML 來添加圖形的傳統(tǒng)做法 ,由于受存儲方式限制 ,其下載速度慢 ,且不能進展放大 、減少等功能 。單純采用 HTML 不能很好地表示矢量圖形 ,不能處理這方面的問題 。采用 VML 可以為這一問題提供合理的處理方案 。利用 VML 結(jié)合 ASP 訪問數(shù)據(jù)庫 ,動態(tài)生成客戶端腳本 ,繪制出矢量圖形 。結(jié)果闡明采用這種方式可以充分發(fā)揚 ASP 的優(yōu)勢 ,并能表

15、示出籠統(tǒng)生動 、可放大減少而不影響圖像質(zhì)量的矢量圖形 。最后結(jié)合一個實例 ,繪制了數(shù)據(jù)項統(tǒng)計比較走勢圖 ,具有較強的表現(xiàn)力 。充分闡明采用VML 繪制矢量圖形具有極大的優(yōu)勢 。. 研討的內(nèi)容.本次預(yù)期研討的重點是:()研討實現(xiàn)WEB統(tǒng)計圖表的技術(shù),分析VML與其他技術(shù)比較所具備的優(yōu)點。()用VML實現(xiàn)柱形圖,餅形圖,曲線走勢圖等效果。.研討的難點是:做一個VML網(wǎng)頁畫圖畫板,能實現(xiàn)動態(tài)畫圖,例如可以畫直線,矩形,圓形,橢圓,圓形,還可以編輯文字,插入圖片等等;學(xué)生選課投票統(tǒng)計數(shù)據(jù)在web中顯示,數(shù)據(jù)是以柱形圖和餅形圖實現(xiàn);電壓合格率實時曲線在web中顯示某個時段的電壓合格率;數(shù)據(jù)是以曲線走勢圖

16、實現(xiàn);最后設(shè)計一個web綜合圖表的實現(xiàn),采用ASP+VML言語實如今網(wǎng)頁中輸入數(shù)據(jù),實現(xiàn)D柱形圖,餅形圖,曲線走勢圖年度統(tǒng)計等效果。第二章 可行性研討分析. Web數(shù)據(jù)庫運用系統(tǒng)在Web數(shù)據(jù)庫運用系統(tǒng)的開發(fā)過程中,需求給用戶提供直觀 、美觀的諸如柱型圖、餅圖、實時曲線圖等的數(shù)據(jù)統(tǒng)計圖,運用戶可以方便地查看數(shù)據(jù)分布、變化的實時過程。在常用的網(wǎng)絡(luò)編程言語中,通常采用其內(nèi)植的繪圖 API來實現(xiàn)統(tǒng)計圖形的繪制。但是其存在著明顯的缺陷:通常產(chǎn)生 GIF 或 JPG 等類型的圖片 ,與 Web 其他部分不能很好地交融 ;圖片下載速度較慢 ;非矢量圖形不能隨意放大或者減少比較容易失真;重用性差。矢量圖具有不

17、受設(shè)備分辨率影響、顯示畫面明晰、可對圖像無限縮放而不會影響圖像質(zhì)量的優(yōu)點 。傳統(tǒng)的言語不能很益處理這方面的問題 ,而運用 VML言語為該問題的處理提供了比較好的處理方案 。. Web信息系統(tǒng)的開展隨著Internet信息系統(tǒng)逐漸向Web的遷移和基于Web的電子商務(wù)系統(tǒng)的開展,Web設(shè)計和開發(fā)人員曾經(jīng)越來越將留意力集中到Web運用程序上,而非最初的Web內(nèi)容創(chuàng)作和編輯排版。Web運用程序更關(guān)注的是數(shù)據(jù)以及如何將數(shù)據(jù)抽取成信息、將信息轉(zhuǎn)化成知識以為管理提供協(xié)助 。管理者需求以更直觀、更籠統(tǒng)的可視化方式將數(shù)據(jù)抽取為信息,然后根據(jù)本人的了解將信息轉(zhuǎn)化成知識。Web圖表是一種很好的將對象屬性數(shù)據(jù)直觀、籠

18、統(tǒng)地“可視化的手段。. Web圖表開發(fā)運用言語的定義. GML(GeographyMarkupLanguage):是基于XML的空間信息編碼規(guī)范,由OpenGISConsortium(OGC)提出,得到了許多公司的大力支持,如Oracle、Galdos、MapInfo、CubeWerx等。. SVG(ScalableVectorGraphics):SVG圖像是與XML.兼容的文檔,SVG元素是指示如何繪制圖像的一些指令,閱讀器(Viewer)解釋這些指令,把SVG圖像在指定設(shè)備上顯示出來。. VML(VectorMarkupLanguage):如今系統(tǒng)IE.以上版本對VML提供支持,它編寫簡單

19、、閱讀器可以解析、與HTML等言語完全兼容,它更具有實踐WEB頁運用的可行性、深層開發(fā)的可行性。. 基于GML、SVG、VML這三種言語的比較Web圖表的設(shè)計和開發(fā)主要是基于GML、SVG、VML這三種言語,且都是基于XML的可用來描畫矢量圖形的標志言語,但它們都有各自不同的用途和特點:. GML(GeographyMarkupLanguage):是基于XML的空間信息編碼規(guī)范,由OpenGISConsortium(OGC)提出,得到了許多公司的大力支持,如Oracle、Galdos、MapInfo、CubeWerx等。運用GML,封裝的地理數(shù)據(jù)和圖形解釋是清楚分別的。. SVG(Scalab

20、leVectorGraphics):SVG圖像是與XML.兼容的文檔,SVG元素是指示如何繪制圖像的一些指令,閱讀器(Viewer)解釋這些指令,把SVG圖像在指定設(shè)備上顯示出來。運用SVG可以在網(wǎng)頁上顯示出各種各樣的高質(zhì)量的矢量圖形,支持很多您想象得出的功能:幾何圖形、動畫、漸變色、濾鏡效果等。最關(guān)鍵的是,它也是完全用普通文本來描畫的!也就是說,這是一種專門為網(wǎng)絡(luò)而設(shè)計的基于文本的圖像格式。. VML(VectorMarkupLanguage):如今也只需IE.以上版本對VML提供支持。運用VML可以在IE中繪制矢量圖形,所以有人以為VML就是在IE中實現(xiàn)了畫筆的功能。VML具有先天的優(yōu)勢,

21、它的表示方法簡單,易于擴展,支持高質(zhì)量的矢量圖形顯示,VML我覺得相當健全(圖型質(zhì)量、輸出速度),它編寫簡單、閱讀器可以解析、與HTML等言語完全兼容,它更具有實踐WEB頁運用的可行性、深層開發(fā)的可行性。. GML、SVG、VML這三種言語都與矢量圖形有著親密的關(guān)系:GML在表示實體的空間信息的同時參與了實體的其他屬性信息,是表示實體的空間信息和屬性的編碼規(guī)范,但它并不支持直接顯示圖形。而VML和SVG是在表示圖形的矢量信息同時參與了圖形的顯示信息即以什么樣的款式顯示矢量圖形,是顯示矢量圖形的兩種比較好的格式。相比之下,SVG是綜合了VML的優(yōu)點后推出的,是國際規(guī)范,它比VML具有更多的優(yōu)點,

22、也有更寬廣的前景。但由于VML有IE的支持,而SVG要想在閱讀器中顯示就需求安裝插件,在這一點上,VML略優(yōu)于SVG,這也是我選擇用采用VML言語實現(xiàn)WEB統(tǒng)計圖表的緣由吧!第三章 目前的主要技術(shù)本次課題WEB統(tǒng)計圖表的研討,我主要采用VML言語實現(xiàn),還會運用到ASP動態(tài)網(wǎng)頁、Dreamweaver開發(fā)工具和Access數(shù)據(jù)庫。ASP是微軟公司開發(fā)的替代CGI腳本程序的一種運用,它可以與數(shù)據(jù)庫和其它程序進展交互,是一種簡單、方便的編程工具,Dreamweaver開發(fā)Web功能強大,支持Web運用與開發(fā),Access數(shù)據(jù)庫是最常用的數(shù)據(jù)庫了,且與VML言語兼容較高,具有實踐運用的可行性和深層開發(fā)

23、的可行性。. HTML與ASP的結(jié)合. HTML言語HTML ( Hypertext Markup Language , 超文本標志言語) ,是一種用來制造超文本文檔的簡單標志言語 。用HTML 編寫的超文本文檔能獨立于各種操作系統(tǒng)平臺(如 UNIX ,WINDOWS 等) 。運用 HTML 言語描畫的文件 ,需求經(jīng)過 WWW 閱讀器顯示出效果 。經(jīng)過 HTML 可以表現(xiàn)出圖片調(diào)用 、文字顯示等豐富多彩的設(shè)計風格 ,可以實現(xiàn)不同頁面之間的跳轉(zhuǎn)和展現(xiàn)豐富多彩的多媒體效果等功能 。在 Microsoft 的產(chǎn)品中 ,網(wǎng)頁與數(shù)據(jù)庫結(jié)合的處理方案是 ASP。尤其在電子商務(wù)網(wǎng)站的建立方面 ,幾乎都是用A

24、SP 編寫程序 。Active Server Pages (ASP) 是效力器端腳本編寫環(huán)境 ,運用它可以創(chuàng)建和運轉(zhuǎn)動態(tài) 、交互的 Web 效力器運用程序 。運用 ASP 可以組合 HTML 頁 、VBScript 腳本命令和JavaScript 腳本命令等 ,以創(chuàng)建交互的 Web 頁和基于 Web的功能強大的運用程序。ASP可以運用 ADO ( Active Data Object ,自動數(shù)據(jù)對象) 進展 Access 和 SQL Server 數(shù)據(jù)庫的銜接訪問 ,取出數(shù)據(jù)庫中的數(shù)據(jù)進展各種操作 ,同時也能讀取其他 ODBC 兼容的數(shù)據(jù)庫 。由于ASP是經(jīng)過效力器解析之后再向閱讀器前往數(shù)據(jù)

25、, 一切嵌入在HTML 中的程序都在效力器端執(zhí)行 ,所以有了 ASP 就不用擔憂客戶的閱讀器能否能運轉(zhuǎn)編寫的代碼 。當程序執(zhí)行終了后 ,效力器僅將執(zhí)行的結(jié)果前往給客戶閱讀器 ,這樣就減輕了客戶端閱讀器的負擔 ,大大提高了交互的速度 。但是這樣導(dǎo)致一個問題 , 運轉(zhuǎn) ASP 頁面比普通的HTML 頁面要慢 。由于普通的 HTML 頁面只需求閱讀器就可以解析 ,而 ASP 那么必需是效力器將整頁的代碼都執(zhí)行一遍之后再發(fā)送數(shù)據(jù) 。這樣添加了效力器的負擔 ,降低了客戶端的效率。為彌補這一缺陷 ,經(jīng)過 ASP 銜接訪問數(shù)據(jù)庫 ,并對數(shù)據(jù)進展操作;在客戶端采用 VML方式對獲得的數(shù)據(jù)進展動態(tài)矢量繪圖 。.

26、 HTML言語的局限性HTML以簡單精煉的語法,極易掌握的通用性與易學(xué)性,使Web網(wǎng)頁得到了極快的推行。HTML過份限制了Web文件的復(fù)雜性與靈敏性,使人們面對復(fù)雜多變的詳細運用束手無策。人們開場全力重新構(gòu)造Web圖表,誕生了許多新的技術(shù)。VM L言語就是其中最引人注目的一項技術(shù)。. VML言語. VML簡介VMLVector Markup Language是微軟年月附帶IE.發(fā)布的。它以最簡約的標志代碼,在WEB頁快速繪制輸出矢量圖型線段、圓形、矩形、圓矩形、矢量圖像、曲線、多邊形、弧型、并修飾這些圖形的邊框、陰影、填充、背景、漸變、箭頭、D等等外觀效果。能井然有序跟HTML超文本嚴密結(jié)合,

27、或攙和在HTML標簽內(nèi),或把HTML標簽?zāi)依ㄆ渲谐淙蝺?nèi)容。幾乎支持CSS款式表一切的款式屬性寬度、高度、D-XYZ位置、鼠標外形、裁剪、排版縮進、縮放等等。VML所繪制的每一個圖形,都跟HTML一樣是一個圖形對象,同樣支持DHTML對象編程模型、DHTML事件編程模型。輕松的讀取、更改VML圖形對象的各種屬性,響運用戶觸發(fā)的鼠標、鍵盤等事件,實現(xiàn)與用戶交互。假設(shè)有機的配合setTimeout、setInterval兩個定時器方法,那么能實現(xiàn)類似Flash一樣復(fù)雜的動畫,輸出質(zhì)量相當?shù)暮谩V恍鐳HTML、JS編程功底足夠深,任何復(fù)雜的動畫都可以實現(xiàn)。. VML言語的益處運用 VML可以在 IE

28、中繪制矢量圖形 ,能將圖形信息與文本信息及其他數(shù)據(jù)集成在一同 ,是一種用文本方式描畫矢量圖形的言語 。VML 在 Web 上建立的高效 、靈敏和簡約的矢量圖形可以恣意放大減少而不損失圖形的質(zhì)量 ,在制造地圖上有很大用途 。結(jié)合一種網(wǎng)絡(luò)編程言語就能設(shè)計出動態(tài)的統(tǒng)計圖形 。并可以結(jié)合客戶端腳本 , 讓圖形產(chǎn)生動態(tài)的效果 。在數(shù)據(jù)交互的過程中 ,效力器只須將變化的數(shù)據(jù)發(fā)送到客戶端即可 。不僅易于對繪制的圖形進展控制 ,而且充分利用了客戶端的資源 ,減輕了效力器的負荷 。其根本規(guī)那么是 :單個的元素被定義為外形 , 大多數(shù)外形是由矢量途徑描畫的 ,它提供了一些預(yù)定義的外形如直線 、曲線等 。VML外形

29、可以單獨產(chǎn)生 ,也可多個外形相關(guān) 。由于各個外形本身都包含了本身的特征比率信息 ,所以整個組可以擴展而不會影響到其中包含的內(nèi)容 。. VML言語的特點XML是公認的擁有無窮生命力的下一代網(wǎng)絡(luò)標志言語 ,XML 和 HTML 一同運用 ,極大地擴展了 Web 頁面的才干, VML作為XML的一個子集 , 具有先天的優(yōu)勢 ,它的表示方法簡單 ,易于擴展 。支持高質(zhì)量的矢量圖形顯示 ,它們基于由相銜接的直線和曲線描畫途徑。在VML言語中運用兩個根本的元素 : Shape 和Group ,這兩個元素定義了 VML 言語的全部構(gòu)造 。Shape 描畫一個矢量圖形元素 ,而 Group 用來將這些圖形結(jié)合

30、起來 ,這樣它們可以作為一個整體進展處置 。VML言語規(guī)范包括大量的支持多種不同矢量圖形特征的元素 。其預(yù)定義的主要圖形元素有:Shape , Path , Line , Polyline , Curve , Rect , Roundrect , Oval ,Arc , Group 。同時由于 VML言語運用簡單的文本來表示圖像 ,這樣就可用很少的字節(jié) 來表示比較復(fù)雜的圖像。VML與HTML 的兼容 , 經(jīng)過在 HTML 中聲明 VML命名空間并聲明處置函數(shù) ,就可以和其他 HTML元素一樣運用 VML元素 ,在客戶端閱讀器顯示圖像。VML標志里面可以定義DHTML大部分屬性和事件,比如id,

31、 name , title ,on mouseover等等。. VML言語的運用VML言語終究能在WEB頁中做些什么呢!下面作簡單的運用引見吧:. 圓角表格、表格斜線、圓形、曲線等等,是做為HTML言語的補足;. 數(shù)據(jù)圖表(餅圖、柱狀圖、曲線圖)、圖像處置(VML可將圖像矢量化,能進展亮度、對比度、顏色度、漫畫風格、圖像外型、顏色交融的處置)、圖像繪制;. 制造D網(wǎng)頁、VML動畫特技、VMLFlash動畫、VML游戲。VML言語運用功能強大,無不讓程序開發(fā)者們怦然心動啊!第四章VML的根本用法. VML根本語法在VML言語里面,標志運用的是XML言語的擴張,namespace (命名空間) ,

32、可以運用慣用的“v間,并且把它和系統(tǒng)預(yù)定義的行為VML用IE.到IE.版本通用的定義如下:v : Behavior : url ( # default # VML ) 其中xmlns是指XML namespaceBehavior (行為)是IE.新推出的,它把命名空間“v統(tǒng)預(yù)定義的行為VML銜接 。這樣定義以后,V的運用中運用如下標志: 這個標志必需是成對出現(xiàn) 。和普通的HTML別,每個標志都添加了一個命名空間。VML有本人的坐標系,運用CoordSize定義坐標,這樣動態(tài)改動它的坐標,就可以實現(xiàn)隨意放大 、減少 、旋轉(zhuǎn)等功能 。Shape對象是VML最根本的對象,是Path ,利用它可以畫出

33、一切想要的圖形 。Shape生出來的一些對象,比如說Rect (矩形) , RoundRect (矩形) ,Oval (圓) ,Line (線) , PolyLine (不規(guī)那么折線(圖形文件)等等 。Group容器能讓一系列的VML元素對象,假設(shè)運用了超越一個VML對象的頁面都運用容器,同時可以經(jīng)過動態(tài)改動它的CoordSize的大小和整個Group里面的VML元素對象。初始化和數(shù)據(jù)讀取的過程 。主頁面中帶有腳本,如添加VML元素的功能。子頁面是個ASP程序,從庫中讀取出數(shù)據(jù),生成相應(yīng)的腳本:function draw Graph ( x ,y ,value)然后就是在Body用一個Ifra

34、me做后臺,用來讀取數(shù)據(jù)庫中的數(shù)據(jù);為命名空進展銜接 。使也就是命名空間。和系就可以在后標志有所區(qū)屬性就是用來它最主要的屬性對象派圓角) , Image對象運用共同的坐標Group值放大或縮下面就是定義繪制圖形的腳本函數(shù)以及進展頁面初可以實現(xiàn)諸從數(shù)據(jù)中初始化腳本和讀取數(shù)據(jù) ??梢允骨芭_用腳本生成 : 由于能夠會產(chǎn)生后臺已完成讀數(shù)據(jù)操作 ,而前臺還沒有初始化的情況 ,因此把腳本放在 Body 的前面 , Iframe 放在 Body 的最后面 。相應(yīng)的在 readData. asp里面 :parent.draw Graph ( , , ) ;這樣就實現(xiàn)了讀取數(shù)據(jù)庫中的數(shù)據(jù)并運轉(zhuǎn)腳本言語進展畫圖的

35、功能 。. VML的常用標志VML是經(jīng)過XML標志來描畫矢量圖形的,所以必需遵照一定規(guī)那么,和HTML標志的通用屬性如:id、name、class、title、style等一樣,VML標志也有本人的通用屬性、支持HTML的通用屬性、支持CSS的款式定義。經(jīng)過這些屬性,他們可以修飾VML圖形如線、圓形的外形、大小、顏色、內(nèi)容、邊框,以及定義鼠標款式、編程用的ID索引、提示標題等等。標志特有的通用屬性非HTML、CSS一切VM標志屬性表屬性名默許值值類型/范圍用途strokeweight .pt=px number描畫圖形的邊框粗度strokecolor black color描畫圖形的邊框顏色s

36、troked true boolean描畫圖形能否運用邊框fillcolor white color描畫圖形的背景顏色filled true boolean描畫圖形能否運用背景print true boolean描畫圖形能否允許被打印機打印coordsize , VectorD暗示圖形與容器空間的大小比例coordorigin VectorDcoordinate at top-left cornerof elementwrapcoords null stringoutline to use for tight textwrapping VML標志屬性表屬性名可用值/可用值范圍用途width -

37、描畫寬度height -描畫高度position static absolute fixed relative描畫如何定位輸出left -描畫間隔 頁面位置左top -描畫間隔 頁面位置上z-index -描畫D位置cursor auto crosshair hand move help wait text描畫鼠標外形zoom -描畫縮放比例clip rect(上右下左)描畫裁剪對象border - style color描畫邊框display block none inline list-item描畫顯示或隱藏overflow visible auto hidden scroll描畫滾動條c

38、olor colorstring描畫文本內(nèi)容顏色font-size -描畫文本內(nèi)容字號filter xray flipv fliph invert alpha(opacity=num)描畫濾鏡效果rotation(-)%描畫旋轉(zhuǎn)度flip x y描畫反轉(zhuǎn)或顛倒圖形. 圖形與圖像算法在VML中的實現(xiàn)自年微軟公司發(fā)布VML.版以后,VML言語不但對作圖功能有了強大的改良而且對圖形圖像的處置也有了較強的提高。目前VML曾經(jīng)成為最強的網(wǎng)頁編輯工具之一,可以完成根本的三維網(wǎng)頁的設(shè)計,做圖及圖形處置,并且支持高質(zhì)量的圖像顯示。正由于VML基于XML規(guī)范而XML是公認擁有無窮生命力的下一代網(wǎng)絡(luò)標志言語,所以

39、VML具有先天的優(yōu)勢,它的表示方法簡單,易于擴展等等。相比之下,GMLGeography MarkupLanguage、SVGScalable Vector Graphics、VML都與矢量圖形有著親密的關(guān)系。GML在表示實體的空間信息的同時參與了實體的其他屬性信息,是表示實體的空間信息和屬性的編碼規(guī)范,但它并不支持直接顯示圖形。而VML和SVG是在表示圖形的矢量信息同時參與了圖形的顯示信息即以什么樣的款式顯示矢量圖形,是顯示矢量圖形的兩種比較好的格式。相比之下,SVG是綜合了VML的優(yōu)點后推出的,是國際規(guī)范,它比VML具有更多的優(yōu)點,也有更寬廣的前景。但由于VML有IE的支持,而且有人以為V

40、ML就是IE中的畫筆,而SVG要想在閱讀器中顯示就需求安裝插件,在這一點上,VML遠遠優(yōu)于SVG。二者都支持很多您想象得出的功能:繪制幾何圖形、動畫、漸變色、濾鏡效果等。在VML中運用兩個根本的元素:shape和group。這兩個元素定義了VML的全部構(gòu)造;shape描畫一個矢量圖形元素,而group用來將這些圖形結(jié)合起來,這樣它們可以作為一個整體進展處置。以下是本文所涉及VML的圖形元素有:Shape、Path、Line、Polyline、Curve、Rect、Roundrect、Oval、Arc、Group等。由于內(nèi)容太多太雜,只解釋部分概念如下:line線標志、XYZ坐標與單位概念:li

41、ne標志可以在網(wǎng)頁中從個X,Y交接點到另個X,Y交接點之間,創(chuàng)建一條直線。oval圓與rect矩型:VML的oval和rect分別可以繪制圓形與矩形。RoundRect圓矩型arc圓弧image圖片的插入與圖像處置polyline多邊型shape多邊型與polyline多邊型的優(yōu)劣比較shapetype模版shape曲線background背景group集合容器:該標志不是用來輸出某種圖形的、運轉(zhuǎn)時其本身也不可見,而且也沒有公用屬性,只需VML通用屬性,但卻也是非常重要的、特殊的VML標志。它的作用就是充任“類似父或母的身份將多個“類似兒女成員的圖形囊括其中,然后他可以單獨性的描畫“父母,不用

42、一個一個去控制“單個子女,從而實現(xiàn)了“全員子女承繼“父母的遺傳。Id,class,style(top,left,width,height,rotation,z-index,position,visibility,display),title,href,target,alt,coordsize,coordorigin等等屬性。而在在實踐運用中,最重要的是讓“子女承繼CSS-style()括號里的屬性。vmlframe圖形援用shadow陰影fill填充extrusion立體D級標志:上面所說到的VML通用屬性,是針對像oval、rect、roundrect這樣的一級標志而言的。而對于大多數(shù)的二級

43、標志,是不支持的,只需一個例外,像Textbox內(nèi)容,即能當作一級標志又能當作二級標志。不過id這個通用屬性,是一切的一、二級標志均支持的屬性。textbox內(nèi)容imagedata背景圖片textpath文本途徑VML規(guī)范包括大量的支持多種不同矢量圖形特征的元素。由文本構(gòu)成的圖像,并可集成到HTML。由于VML運用簡單的文本來表示圖像,這樣就可用很少的字節(jié)來表示比較復(fù)雜的圖像。VML與HTML兼容,經(jīng)過在HTML中聲明VML命名空間并聲明處置函數(shù),就可以和其他HTML元素一樣運用VML元素,在客戶端閱讀器顯示圖像。VML標志里面可以定義DHTML大部分屬性和事件,比如說id,name,titl

44、e,onmouseover等等。支持交互與動畫。但VML的功能不只是繪圖,他還可以在圖形中嵌入文本,并可實現(xiàn)超鏈,還可經(jīng)過腳本言語實現(xiàn)一定的動畫功能。. ASP結(jié)合VML動態(tài)開發(fā)原理ASP 運用 ADO 存取數(shù)據(jù)庫 。而 ADO 的實踐數(shù)據(jù)存取操作是經(jīng)過 OLEDB 或 ODBC 驅(qū)動程序進展的 。運用ADO 可以在 ASP 中編寫可以直接操作執(zhí)行的 SQL 語句來操作數(shù)據(jù)庫 。其根本義務(wù)就是和數(shù)據(jù)庫建立銜接 、向數(shù)據(jù)庫發(fā)送 SQL 語句 、處置數(shù)據(jù)庫前往的結(jié)果 。圖 為 ASP 與 VML 結(jié)合的原理圖 。數(shù)據(jù)層存放大量數(shù)據(jù)資源 。中間層為 Web 效力器端 ASP 動態(tài)程序 ,經(jīng)過 OLE

45、DB 或者 ODBC 驅(qū)動的 ADO 與數(shù)據(jù)庫進展數(shù)據(jù)交互 ,擔任從數(shù)據(jù)層中查詢出所要的統(tǒng)計信息 。表示層采用VML 動態(tài)生成統(tǒng)計結(jié)果圖表 ,在此采用頁面中嵌入 VML語句和運用 ASP 動態(tài)生成 VML 相結(jié)合的方式 ,動態(tài)生成表示統(tǒng)計結(jié)果的矢量統(tǒng)計圖形 ,也就是生成了一個用文本言語表示的 Web 矢量統(tǒng)計圖 。圖 ASP 與 VML 結(jié)合原理圖第五章 程序?qū)崿F(xiàn).義務(wù)概述.本次預(yù)期研討的重點是:()研討實現(xiàn)WEB統(tǒng)計圖表的技術(shù),分析VML與其他技術(shù)比較所具備的優(yōu)點。()用VML實現(xiàn)柱形圖,餅形圖,曲線走勢圖等效果。. 研討的難點是:做一個VML網(wǎng)頁畫圖畫板,能實現(xiàn)動態(tài)畫圖,例如可以畫直線,矩

46、形,圓形,橢圓,圓形,還可以編輯文字,插入圖片等等;學(xué)生選課投票統(tǒng)計數(shù)據(jù)在web中顯示,數(shù)據(jù)是以柱形圖和餅形圖實現(xiàn);電壓合格率實時曲線在web中顯示某個時段的電壓合格率;數(shù)據(jù)是以曲線走勢圖實現(xiàn);最后設(shè)計一個web綜合圖表的實現(xiàn),采用ASP+VML言語實如今網(wǎng)頁中輸入數(shù)據(jù),實現(xiàn)D柱形圖,餅形圖,曲線走勢圖年度統(tǒng)計等效果。.用戶的特點Web圖表是一種很好的將對象屬性數(shù)據(jù)直觀、籠統(tǒng)地“可視化的手段。基于VML言語設(shè)計Web統(tǒng)計圖表,Web統(tǒng)計圖表對象屬性數(shù)據(jù)直觀,提供可視化數(shù)據(jù),操作簡一方便,數(shù)據(jù)分布走勢一目了然,尤其適宜各類運用計算機的管理人員。.需求規(guī)定本次設(shè)計研討主要是用VML言語實現(xiàn)柱形圖,

47、餅形圖,曲線走勢圖等D效果。. Web信息流程構(gòu)造設(shè)計:信息組織、關(guān)聯(lián)和集成等是一種非常重要的信息重構(gòu),它對信息的查詢、閱讀及信息間的相互聯(lián)絡(luò)起著關(guān)鍵作用,應(yīng)采用基于人性化的信息聯(lián)想思想方式來設(shè)計整個圖表系統(tǒng)的信息流向及相互關(guān)系等。需求對用戶在信息探求活動過程中的信息閱讀順序、信息交互方式和信息相關(guān)聯(lián)想等問題進展深化研討,從而設(shè)計出一種為大多數(shù)用戶所接受的圖表系統(tǒng),即經(jīng)過多種方式來建立信息間的關(guān)系鏈接。. Web統(tǒng)計圖表類型的選擇:Web圖表要表現(xiàn)的主題決議了圖表的表現(xiàn)方式,根據(jù)主題來決議哪一種對比關(guān)系是主要的,哪一種是次要的。圖表是經(jīng)過數(shù)據(jù)信息的組織來展現(xiàn)或強調(diào)主題信息的。柱形圖最適宜顯示時

48、間序列的對比關(guān)系。普通情況下,盡量防止運用條形圖顯示隨時間變化的信息特征,由于表示時間分布習慣于從左到右,而非從上到下。曲線走勢圖那么偏重于變化趨勢,比較適宜反映對象開展趨勢,而柱狀圖注重展現(xiàn)程度和數(shù)量,適宜表示某一時間段內(nèi)的信息屬性。 餅形圖給人以整體的印象,因此,顯示成分對比關(guān)系可用餅圖來展現(xiàn)。假設(shè)數(shù)據(jù)項超越個,可保管個最重要部分,其他合并為“其它,以便使餅圖發(fā)揚最大可視化效果。此外,根據(jù)需求,可將最重要的內(nèi)容放在點的位置附近人眼習慣于順時針方向看東西,同時可經(jīng)過顏色、立體處置或分別等手段來突出顯示。由于統(tǒng)計信息的多樣性、復(fù)雜性,可經(jīng)過圖表間的相互疊加來展現(xiàn)信息間的內(nèi)部構(gòu)成對比、外部構(gòu)造特

49、征對比以及對象的時態(tài)變化特征等。. Web統(tǒng)計圖表界面設(shè)計:普通地,圖表盡能夠簡約,假設(shè)需求采用組合圖表構(gòu)造,必需使圖表層次化更為明晰,以便更為快速清楚地反映要表達的主題信息內(nèi)容。由于Web圖表運用在網(wǎng)絡(luò)上,應(yīng)盡量思索到各種用戶計算機窗口的差別,將圖表完好地顯示在這些計算機的窗口上。例如:一致性是界面設(shè)計最根本的原那么,它是界面易于運用的關(guān)鍵,但有時為了讓用戶更直觀地感受和了解圖表要表現(xiàn)的主題,需求采用以下手段建立信息層次構(gòu)造間的關(guān)系:加重顏色、運用陰影、加強對象輪廓、運用立體或?qū)懻娣?、采用動態(tài)符號。另外,設(shè)計圖表時,須全面思索影響圖表可視化的要素,內(nèi)部數(shù)據(jù)數(shù)值對比反差的大小,圖表在空間分布

50、的密度以及小空間大圖表矛盾等。. Web統(tǒng)計圖表的實現(xiàn):下面經(jīng)過論述VML中的常用標志來闡明Web圖表的實現(xiàn)步驟:. 運用Group標志創(chuàng)建一個容器,作為其它組成Web圖表的VML標志的共同坐標系,經(jīng)過設(shè)置Group標志的style屬性可以確定圖表的位置和大小等;. 經(jīng)過添加Rect、Oval、Arc、Line、PolyLine等外形標志創(chuàng)建圖表的主體。其中,Rect標志用于創(chuàng)建矩形,可由它來實現(xiàn)條形圖和柱狀圖;Oval標志用于創(chuàng)建圓,Arc標志用于創(chuàng)建弧,結(jié)合這兩個標志可以實現(xiàn)餅圖;Line標志用于創(chuàng)建線段,Line標志是Line標志的變形,用于創(chuàng)建不規(guī)那么的延續(xù)的線段,這兩個標志可用于創(chuàng)建

51、折線圖。另外,VML提供一種默許外形標志Shape,經(jīng)過指定其path屬性可創(chuàng)建出需求的任何外形,上述一切標志都是由它派生出來的。在運用上述外形標志創(chuàng)建Web圖表主體時,可運用外形標志的子標志Shadow和Fill來分別設(shè)置外形的陰影和填充效果來加強外形的顯示效果和不同外形的對比效果;. 運用標志Line及其子標志Stroke來創(chuàng)建坐標系。Stroke標志中的StartRow和EndRow屬性用于創(chuàng)建箭頭;. 運用標志TextBox來設(shè)置圖表的標題、圖例和刻度的值。. Web統(tǒng)計圖表的開發(fā)與設(shè)計:Web圖表設(shè)計是以用戶為中心的多學(xué)科設(shè)計,遭到視覺藝術(shù)、計算機技術(shù)、主題內(nèi)容、圖表用途以及心思感受

52、和信息設(shè)計等多種影響。在對統(tǒng)計信息在可視化時的根本屬性進展分析與研討后,給出Web圖表的定義:Web圖表泛指在閱讀器中顯示的,可直觀展現(xiàn)統(tǒng)計信息屬性時間性、數(shù)量性等,對知識發(fā)掘和信息直觀生動感受起關(guān)鍵作用的圖形構(gòu)造。不同類型的Web圖表能夠具有不同的構(gòu)成要素,如折線圖普通要有坐標軸,而餅圖普通沒有。歸納起來,Web圖表的根本構(gòu)成要素有:標題、刻度、圖例和主體等等。. 運轉(zhuǎn)環(huán)境規(guī)定.設(shè)備:采用個人計算機(pc),運用系統(tǒng)WindowsXP或windows,且支持IE以上閱讀器。.支持軟件:本次課題WEB統(tǒng)計圖表的研討,我主要采用VML言語實現(xiàn),還會運用到ASP動態(tài)網(wǎng)頁、Dreamweaver開發(fā)

53、工具和Access數(shù)據(jù)庫。. 實現(xiàn)程序?qū)嵗? VML網(wǎng)頁畫圖畫板:實現(xiàn)該網(wǎng)頁畫圖畫板用到了vml言語和js腳本言語,保管以html為后綴名的網(wǎng)頁文件。其實現(xiàn)的普通步驟如下:. 新建并命名VmlDraw.js文件,用記事本進展編輯,該文件主要是用來定義變量和函數(shù),其偽代碼:var VmlTool=new VmlDraw(); /定義VmlDraw變量;function VmlDraw(); /定義VmlDraw功能;var imageMenu,imageMove=,imagesets=new Array(); /定義右鍵菜單;var baseImage(); /定義雙箭頭、單箭頭、直線、弧形、

54、圓形、長方形、圓矩形等運用款式;var left,top,width,height,rotation,id; /定義畫板畫圖框架;var status; /定義在畫板內(nèi):刪除,:修正,:添加;oButton=owner.CreateButton(); /定義雙箭頭、單箭頭、直線、弧形、圓形、長方形、圓矩形等相關(guān)控件;還要定義一些功能控件:oCell.appendChild(document.createElement(br);oButton=owner.CreateButton(oCell,biankuan,bon,huabi,左鍵點擊目的圖形);oButton.innerText=邊框;oB

55、utton=owner.CreateButton(oCell,tianchong,bon,huabi,左鍵點擊目的圖形,支持背風光填充、背景圖片、完全空心化); oButton.innerText=填充;oButton=owner.CreateButton(oCell,suofang,bon,huabi,左鍵點擊目的圖形);oButton.innerText=縮放;. 新建并命名vml畫圖畫板.html文件,用記事本進展編輯,該文件主要是用VML實現(xiàn)畫板畫圖和調(diào)用VmlDraw.js文件,其偽代碼:() VML畫圖畫板 /定義畫板標題() /定義畫板風格v:*behavior:url(#def

56、ault#VML); /VML言語的標識定義o:*behavior:url(#default#VML); /VML言語的標識定義select,input,button,textareafont-size:px /文本區(qū)域的大小定義atext-Decoration:none;color:red /文本區(qū)域的顏色定義a:hovertext-Decoration:underline;color:blue; /文本線條定義tablebackground-color:#FCDCF; /網(wǎng)頁表格定義及字體定義tdfont-size:px;color:;spanfont-size:px;white-Spac

57、e:nowrap;.bonborder-bottom:solideeeeee;border-right:solid eeeeee;border-left:solidgray;border-top:solid gray;background-color:dddddd;color:blue;width:;cursor:hand;.bonborder-bottom:solidgray;border-right:solid gray;border-left:solidwhite;border-top:solid white;background-color:#FCDCF;color:maroon;wi

58、dth:;cursor:hand;font-family:宋體;.bonborder-bottom:solidmaroon;border-right:solid maroon;border-left:solidmenu;border-top:solid menu;background-color:#FED;color:purple;width:;cursor:hand;font-family:宋體;textareaborder: groove purple;#cencolor:maroon;font-weight:bold;width:%;height:%;cursor:move#xiaole

59、icolor:red.keshiposition:absolute;z-index:;. zhongyaocursor:hand;font-weight:bold;color:red /畫板主題風格定義終了() /腳本言語的援用. 他們還可以在畫板上插入圖片:首先新建并命名uploadifream.htm文件,用記事本進展編輯,該文件主要是實現(xiàn)插入圖片框架和嵌入vml畫圖畫板.html文件中,其偽代碼:() 下載框架頁 /定義框架標題() function addFile() /定義插入文件功能 if(document.getElementById(inputid).value!=) vart

60、empid=inputid; parent.document.getElementById(ifreambutton).srcid=tempid;/文本元素的定義 parent.document.getElementById(ifreambutton).srcvalue=document.getElementById(inputid).value; document.getElementById(inputid).style.display=none; inputid=f+getuid(); varstr=; /定義插入圖片框架 document.getElementById(filediv)

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論