目标： X3D 与 HTML5

目前X3D工作组为了能将X3D与HTML整合得最好，加入了HTML工作组。

该项努力对Web3D - 事实上对所有3D图形 - 具有重要战略性意义，因为X3D是各种模型的数据交换格式。

我们考虑了在HTML页面中显示X3D场景的三种基本途径。

(外部引用) HTML页面包含一个元素标签 - 引用.x3d场景，通过X3D插件来实现。在页面内可以使用DOM事件来传递数据。
(X3D作为HTML中的XML元素) HTML页面直接包含X3D源码，很可能带有XML名空间前缀，大致可以通过X3D插件或浏览器本身来实现。
(API访问方式) HTML页面包含某种形式的canvas (或者可能为 Canvas3D )元素，允许对页面进行编程式访问，以便X3D场景访问接口(SAI)可以绘制位图

待续。。。

Variations on these approaches are considered as part of X3D and HTML5 examples .

Important new work includes the X3DOM suite by Fraunhofer, which shows native X3D within an HTML page.

Our X3D and HTML5 Summary slideset was presented at the HTML5 Working Group sessions Friday 6 November 2009 in Mountain View during the W3C Technical Plenary and Advisory Committee (TPAC) meeting. As a result we are now actively working on showing X3D as XML in HTML .

HTML 5

The HTML working group page states:

       What is HTML?  HTML is the publishing language of the World Wide Web.

The latest editor's draft Hypertext Markup Language (HTML) recommendation states:

       HTML 5

W3C Working Draft

A vocabulary and associated APIs for HTML and XHTML

       13.2 Declarative 3D scenes


Embedding 3D imagery into XHTML documents is the domain of X3D,

or technologies based on X3D that are namespace-aware.

       4.8.5 The object element


The object element can represent an external resource, which, depending on

the type of the resource, will either be treated as an image, as a nested

browsing context, or as an external resource to be processed by a plugin.

       4.8.6 The param element


The param element defines parameters for plugins invoked by object elements.

Technical Tasks

We are working on the following tasks.

Ensure that all HTML5 questions and issues relative to X3D are properly considered and answered.
Document how native X3D in .xml encoding can be best be embedded inside an HTML5 document, typically in a namespace-aware fashion
Demonstrate X3D+HTML5 examples on the Web3D Consortium website
Examine how X3D pertains to related HTML5 tags (such as object and canvas) that are used for plugin-type content
Track MIME type issues
Examine overall interoperability issues: combined X3D and HTML content with one floating over the other
- X3D scene with transparent background floating over HTML document or desktop
- HTML text overlay laid out over an X3D scene as help
Identify API issues of mutual interest (such as DOM, Ajax and XHR) for further developmental work
Consider direct integration of Scalable Vector Graphics (SVG) images as a supported format for X3D ImageTexture node

Work Support

Maintain this X3D and HTML5 wiki page to track issues and progress
Identify people in HTML5 working group who want to collaborate with us on these issues
Report regularly on efforts to x3d@web3d.org mailing list and in our every-other-week X3D working group teleconferences
Discussions to occur on the x3d@web3d.org mailing list and public-html@w3.org mailing list
Other tasks and efforts as needed

Participation

Relevant HTML5 and W3C information:

HTML Working Group especially Membership and Participation
World Wide Web Consortium (W3C)
W3C Process Document

The following individuals have volunteered to serve as X3D Working Group representatives in the HTML5 Working Group.

Johannes Behr, Instant Reality , Fraunhofer Research, Darmstadt Germany
Don Brutzman , Naval Postgraduate School (Web3D-W3C liaison and W3C Advisory Committee representative), Monterey California USA
John Stewart, FreeWrl , Communications Research Center (CRC) Canada
Joe Williams, HyperMultiMedia , Santa Rosa California USA

Any other Web3D Consortium members who are interested in serving as one of our X3D Working Group representatives is asked to review the HTML working group membership materials, notify the X3D working group that you are interested, and describe what your goals will be.

Meetings

Our weekly X3D and HTML5 teleconference is usually 0800-0900 (pacific time) each Tuesday.

Designated members can participate Web3D HTML5 teleconference call.

Annotated References

X3D and HTML4

HTML Object Tag for X3D shows how to place X3D objects within an HTML page
newHtmlPageWithX3dObject.html is an example HTML scene with X3D object tag to copy, edit and reuse.
X3D Abstract Specification
X3D Scene Access Interface (SAI) Edition 2
- 6.3.13 importDocument service is a utility request to import a W3C DOM document or document fragment and convert it to an X3D scene.

HTML4 and XHTML

HTML 4.01 HyperText Markup Language (HTML)
XHTML Extensible HyperText Markup Language (XHTML)

HTML5

HTML Design Principles
4.8 Embedded content
- 4.8.1 The figure element represents some flow content, optionally with a caption, which can be moved away from the main flow of the document without affecting the document's meaning.
- 4.8.2 The img element represents an image.
- 4.8.3 The iframe element represents a nested browsing context.
- 4.8.4 The embed element represents an integration point for an external (typically non-HTML) application or interactive content. (See HTML issue embed element should be deprecated )
- 4.8.5 The object element can represent an external resource, which, depending on the type of the resource, will either be treated as an image, as a nested browsing context, or as an external resource to be processed by a plugin.
- 4.8.6 The param element defines parameters for plugins invoked by object elements. It does not represent anything on its own.
- 4.8.7 The video element represents a video or movie.
- 4.8.8 The audio element is a media element whose media data is ostensibly audio data.
- 4.8.9 The source element allows authors to specify multiple media resources for media elements. It does not represent anything on its own.
- 4.8.10 Media elements are used to present audio data, or video and audio data, to the user.
- 4.8.11 The canvas element represents a resolution-dependent bitmap canvas, which can be used for rendering graphs, game graphics, or other visual images on the fly.
- 4.8.12 The map element , in conjunction with any area element descendants, defines an image map. The element represents its children.
- 4.8.13 The area element represents either a hyperlink with some text and a corresponding area on an image map, or a dead area on an image map.
- 4.8.14 Image maps allows geometric areas on an image to be associated with hyperlinks.
- 4.8.15 MathML from the MathML namespace falls into the embedded content category for the purposes of the content models in this specification.
- 4.8.16 SVG from the SVG namespace falls into the embedded content category for the purposes of the content models in this specification.
- 4.8.17 Dimension attributes

Canvas for 2D and 3D

Canvas 2D API 1.0 Specification W3C Editor's Draft highlights SVG goals and approach
Khronos Canvas3D press release from SIGGRAPH 2009 about working group efforts for Javascript bindings to OpenGL ES
Mozilla Canvas:3D proposal
Firefox Canvas3D is a prominent possible approach
Canvas 3D Rendering Demo appears to show another way to do things
Java3D Canvas3D is an established API, though not directly related to HTML

X3D and HTML5 Examples

The X3D and HTML5 examples page shows a set of examples ranging from simple to sophisticated.

API details under discussion

We have discussed Johannes' message of 25 March 2009 + responses (Subject: Re: Khronos Press Releases etc.) that included an X3DOM-connector.pdf diagram regarding how X3D might work with DOM, HTML etc. Also discussed the thread on Khronos' presumed upcoming work on Canvas3D element, and past work on Ajax3D.

These and other API topics are all technically related, and of interest, but have varying degrees of maturity.

The primary objective of the current effort is to support X3D and HTML5. Further work on DOM and other APIs is likely to evolve and spin off from this central effort.

X3DOM proposal

Basics

The object element represents external resources like pdf-documents, movies or x3d-worlds. This plugin model works nicely for isolated content and applications which are unrelated to the surrounding xhtml-document. If the web-application developer would like to access and manipulate the object content he or she has to deal with object or plugin specific interfaces. e.g. X3D browser should provide a Scene Access Interface (SAI).

The X3DOM model tries to ease the development of applications by not providing a special interface but following and respecting some basic xhtml rules:

1) Declarative XML content is part of the DOM tree; Embedded with a separate xml namespace

       <?xml version="1.0" encoding="utf-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd

">

<html xmlns="http://www.w3.org/1999/xhtml

">

<body>

<x3d:x3d xmlns:x3d="http://www.web3d.org/specifications/x3d-3.0.xsd

">

<x3d:Scene>

<x3d:Shape><x3d:Box x3d:size="4 4 4" /></x3d:Shape>

</x3d:Scene>                

</x3d:x3d>

</body>

</html>

2) The DOM elements can be used to read and manipulate the content

        <?xml version="1.0" encoding="utf-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN","http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd

">

<html xmlns="http://www.w3.org/1999/xhtml

">

<body>

<x3d xmlns=

"http://www.web3d.org/specifications/x3d-3.0.xsd

">

<Scene>

<Shape><Box size="4 4 4" /></Shape>

</Scene>                

</x3d>

<script type="text/javascript">       

// The namespace URIs

var xhtml_ns = "http://www.w3.org/1999/xhtml

";

var x3d_ns =

"http://www.web3d.org/specifications/x3d-3.0.xsd

";

// Get elements using namespaces

var h1 = 

document.getElementsByTagNameNS(xhtml_ns, "h1");            

var box = 

document.getElementsByTagNameNS(x3d_ns, "Box")[0];

// Edit an attribute of the <Box /> element

alert(box.getAttributeNS(null, "size"));

box.setAttributeNS(null, "size", "2 2 2");    

alert(box.getAttributeNS(null, "size"));

</script>

</body>

3) Events can be used to interact with the content

           <?xml version="1.0" encoding="utf-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN", "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd

">

<html xmlns="http://www.w3.org/1999/xhtml

">

<body>

<x3d xmlns=

"http://www.web3d.org/specifications/x3d-3.0.xsd

">

<Scene>

<Transform>

<Shape><Box size="4 4 4" />

</Shape>

<TouchSensor id="ts" DEF="ts" />

</Transform>

</Scene>                

</x3d>

<script type="text/javascript">                    

// The namespace URIs

var xhtml_ns = "http://www.w3.org/1999/xhtml

";

var x3d_ns = "http://www.web3d.org/specifications/x3d-3.0.xsd

";

// Get elements using namespaces

var h1 =  document.getElementsByTagNameNS(xhtml_ns, "h1");     

var x3d = document.getElementsByTagNameNS(x3d_ns, "x3d")[0];        

var ts = x3d.getElementsByTagName("TouchSensor")[0];

alert("ts=" + ts);

ts.addEventListener("touchTime", function() {

alert("clicked");

}, false);

</script>

</body>

</html>

4) The position of the content in the document defines the position of the visible elements

           The X3D element should also define the position where the content will be integrated into the html page. 

Simular how e.g. SVG or canvas works. A decoupled mechanisms will confuse application developer

Implementation

The X3DOM model should be implemented as native browser feature, simular to SVG, in the future. Current test-implementation utilize the object/SAI model internally. In addition test-versions based on the Canvas3D layer exist. Both need a browser-extension right now to synchronize and update the DOM changes

Further Information

More information can be found in the X3DOM paper at the Web3D 2009 symposium. The slides and paper are available as preprint.

Future work

Some topics might become relevant once HTML5 is established as a formal W3C Recommendation. These are not part of our current planned work.

Publishing X3D Specifications in HTML5
Other topics as needed

X3D 与 HTML5相关推荐

X3D - 一次编写、处处、时时都可渲染的三维图形格式
X3D,一次编写.处处.时时都可渲染的三维图形格式. W3C 正致力于增加HTML 5中对3D的支持,Web3D协会的X3D-HTML5工作组正与W3C紧密协作,阐述他们对整合X3D与HTML的思路和 ...
java可视化压缩_WEB可视化技术发展
EverCraft一直在关注Web可视化技术的发展,本文对国外一篇感觉很不错的综述性文章进行翻译,供这一领域的爱好者相互学习.这篇paper的信息为:"Mwalongo, F., et al ...
使用HTML5在浏览器中开发虚拟现实业务
在SFHTML5小组(San Francisco HTML5 User Group)组织的一场会议中,与会者们的讨论焦点围绕着两个主题:使用HTML5技术--如WebGL.WebVR.Three.js ...
X3D制作简易三维动画
第一次接触X3D,想留下一些自己的学习想法. 首先,直接百度X3D,会发现除了官网文档,其他的资料很少,官网文档全英文,看完它提供的例子后,知道X3D是一个HTML5框架,可以直接在项目文件中引入X3 ...
html5脑图_基于HTML5的三维思维导图软件开发技术研究
龙源期刊网 http://www.qikan.com.cn 基于 HTML5 的三维思维导图软件开发技术研究作者:汪升华唐国纯来源:<软件工程> 2017 年第 10 期摘要: ...
x3d:了解x3dom
x3dom是类似于threejs的存在,threejs能有非常炫酷的效果,但x3dom更加适用cad领域(因为其特有的格式x3d已经被html5所接受),虽然该框架不够流行,但在cad领域是比较合适的 ...
html5代码转换为视频,HTML5中的视频代码详解
摘要腾兴网为您分享:HTML5中的视频代码详解,智学网,云闪付,易推广,小红书等软件知识,以及360win10,流量魔盒,fitbit,上港商城,安卓2.3.7,全民惠,五年级下册英语单词表图片,t ...
HTML5与CSS3权威指南之CSS3学习记录
title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...
HTML5调用手机的Datepicker(日期选择器)
HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证,包含了如下新的输入类型: email url number range Date pickers (date, month, ...

X3D 与 HTML5