Chris Pollett > Students >
Jie Wei Lin

    ( Print View )









    [Del298 (Semester1)]





CS298 Proposal

3D Web Graphics without Plugins using VML

Jiewei (Joyce) Lin (

Advisor: Dr. Chris Pollett

Committee Members:. Sin-Min Lee, Department of Computer Science, ( , Dr. Ho Kuen Ng, Department of Computer Science,


At the present time there is no way to directly view 3D graphics in the most common browsers (Internet Explorer and Netscape) without using a plugin. The closest things that exists at present are LiveGraphics3D [MK01], a Java 1.1 applet for viewing Mathematica objects and a weak XML language that is translated using Javascript to VML in Internet Explorer [GR00]. VML (Vector Markup Language) [W3C98b] is an XML [W3C98] based mark-up language for vector graphics. It is natively supported in Internet Explorer 5 and above, the most commonly used browsers on the web today. The goal of this project is to develop a stylesheet-transformation from the X3D language [W3DC01] to VML. X3D is a version of VRML (virtual reality modeling language) [ANM97] specified as an XML DTD. It is a W3C standard and supports a robust set of tags for describing 3D objects and their behaviors. A stylesheet transformation from X3D to VML would, thus, allow web-sites to exploit 3D without having to worry about whether the client user is patient and competent enough to download and install a plugin.

Paungkaew Sangtrakulcharoen also at San Jose State University is working on a similar project except with target language SVG [W3C01] which is a more robust vector mark-up language. My project will be an Internet Explorer solution to plugin-less viewing of 3D graphics. My project will be a stylesheet-transformation from X3D to VML. Not only do our target languages differ, but our translation languages also differ. Paungkaew Sangtrakulcharoen will be using DOM and ECMAscript (aka Javascript) code [ECMA99] to perform her transformation, while I will be using the stylesheet transformation language XSLT [W3C99] and ECMAscript.

CS297 Results

  • Created an image of a sunset in VML. This deliverable helped me to become reasonably proficient at VML.
  • Created a 3D mock-up apartment in VRML. This deliverable helped me to explore some VRML basic features.
  • Created a translation of histograms to VML. This deliverable gave me a chance to learn XSLT and learn the tricks that I need to play to output some VML tags.
  • Created a style-sheet that outputs a wireframe of a box in VML using XSL and Javascript. This deliverable took me to the doorway of my final project product.

Proposed Schedule

Week 1-3 (Aug 26 Sep 15) Study the techniques to represent 3D objects. Output wire frames of primitive shapes such as Box, Cone, Cylinder, and Sphere.
Week 4 (Sep 16 22)Enhance my stylesheet-transformation so it support rotation, scaling, and transformation.
Week 5-7 (Sep 23 Oct 13)Study color concepts and shading algorithms. Add surface rendering to 3D scenes.
Week 8-11 (Oct 14 Nov 10)Write up CS298 report.
Week 12 (Nov 11 17)Give a CS298 draft to the committee. Clean up code.
Week 13 (Nov 18 24)Prepare final presentation.
Week 14 (Nov 25 Dec 1)Finalize the report.
Week 15 (Dec 2 8)Oral defense.

Key Deliverables:

  • Software
    • A style-sheet that transforms Box, Cone, Cylinder, Sphere and Shape nodes from X3D to VML. X3D tags this style-sheet supports: Box, Cone, Cylinder, Sphere, Transform and Group. Translation, rotation, and scaling can be specified as an attribute/attributes of the Transform tag.
    • Since we are implementing shape nodes this entails we are handling shading (hence must be fast).
    • Users can rotate and translate shapes in real time after they have been initially rendered.
    • Users can trace back scenes that have gone through.
  • Report
    • Background information and motivation behind the study of this writing project.
    • Description of the architecture of the translator.

Innovations and Challenges

  • Current 3D web graphics require a plugin to view unlike my stylesheet-transformation that can view 3D web graphics with Internet Explorer directly.
  • VML only supports very simple tags, such as Shape, line, oval, polyline, etc. My project needs to leave hooks so that different orientations of the object can still be computed.
  • I also need to optimize both the size and speed of my translator and at the same time provide a good level of visual detail [UJ02] so that clients will not become bored by the download time of the translator but still have high quality of 3D graphics.
  • Efficient scene representation schemes will be considered such as [LT02].
  • An efficient data structure is required to keep track of the relation between points, lines, and polygons. This is hard to implement in XSLT. Cone, Cylinder, and Sphere are made out of many small polygons. They all require such a data structure.
  • VML supports gradient. So I will use gradient for shading. For complicated shapes, such as Sphere, Cone, and Cylinder, shading is very challenging. For example, to represent a sphere, I will use many small polygons. I need to come up a method to keep track of each polygon relative to the viewpoint, so I will apply gradient shading to each polygon.
  • Programming 3D graphics on the web has its own challenges different from traditional 3D graphic applications, for instance, viewing histories [LG99].
  • XSLT is an interpretive language. It basically only does things when it sees a tag or after a tag which makes this translator hard to implement.
  • XSLT is not flexible. For example, user-defined JavaScript functions cannot return type Array, or user-defined types.


[ANM97] VRML 2.0 Sourcebook. 2nd ed. A. Ames, D. Nadeau, J. Moreland. Wiley. 1997.

[ECMA99] Standard ECMA-262 ECMAScript Language Specification 3rd ed. ECMA. 1999.

[GR00] 3D Interactive VML. Gareth Richards. 2000.

[LG99] Hartmut Luttermann and Manfred Grauer. VRML History: Storing and Browsing Temporal 3D-Worlds. Proceedings of the 4th Symposium on the Virtual Reality Modeling Language (VRML-99), pp. 153-160, ACM Press, February 23-26 1999.

[LT02] Gordon Lescinsky and Costa Touma and Alex Goldin and Max Fudim and Amit Cohen. Interactive Scene Manipulation in The Virtue3D System. Proceedings of the Web3D 2002 Symposium (WEB3D-02), pp. 127-136, ACM Press, February 24-28 2002.

[MK01] LiveGraphics3D Documentation. Martin Kraus. 2001.

[UJ02] W. Pasman and F. W. Jansen. Scheduling Level of Detail with Guaranteed Quality and Cost. Proceedings of the Web3D 2002 Symposium (WEB3D-02), pp. 43-52, ACM Press, February 24-28 2002.

[W00] 3D Computer Graphics. 3rd ed. Allan Watt. Pearson Education Limited. (Addison Wesley). 2000.

[W3C97] Extensible Markup Language (XML). W3C.

[W3C98a] Cascading Style Sheets, level 2 CSS2 Specification. W3C.

[W3C98b] VML - the Vector Markup Language. W3C.

[W3C99] XSL Transformations (XSLT) Version 1.0. W3C.

[W3C01] Scalable Vector Graphics (SVG) Specification 1.0. W3C.

[W3DC01] Extensible 3D (X3D) Graphics Working Group. Web 3D Consortium. 2001