[whatwg] Fwd: <model/>: A 3D Equivalent to <img/>
David Workman
workmad3 at gmail.com
Mon Nov 2 14:38:30 PST 2009
Oops, hit 'reply' instead of 'reply to all'. Forwarding to the list now
(sorry for the duplicate, brian)
Brian,
I agree that a static 3d rendering isn't really equal to a 2d bitmap, but I
think that the distinction will be lost on most people. As to javascript not
being required? I think that javascript (or some other scripting) will most
certainly be required for any form of interactive 3d scene, in exactly the
same way as HTML currently requires javascript for interactive elements
currently (or some form of plugin driven by a different language).
The rest of your expanded example doesn't fill me with joy though. From the
sounds of things, you are envisaging a complete re-engineering of HTML from
it's current format of a document description language with some
presentation and media elements put in to make it extremely useful and
versatile (and already fraught with legacy problems and some syntactic
ambiguities) into a language for describing the placement and content of a
full interactive 3d environment and 3d user interface. The problems I see
with this are:
* A re-engineering like this would leave the language a complete shambles.
There would be legacy elements all over the place, conflicts galore and I
doubt the result would be usable at all.
* 3d interfaces are barely understood currently, and a lot of the research
in the area seems to point to them actually just not being intuitive. Why
butcher HTML to add support for this when there isn't even necessarily a use
case yet?
* Picking a 3d format to standardise around would be non-trivial and cause
even more fragmentation of the web community. Should the programmable API
resemble DirectX? OpenGL? Should the scene description be .3ds inspired,
maya inspired, VRML inspired or one of the XML based formats also mentioned?
Should it be something new?
* Fallback content would become a nightmare from 3d to 2d. It's bad enough
currently, just dealing with fallbacks from scripted content to static
content. Imagine the problem magnified my having to collapse a dimension as
well.
Now I'm not saying that a 3d language for the web isn't a good idea. I think
the idea has some huge potential. I just don't think that layering it on top
of HTML with all of it's legacy concerns and also it's document centric
model is a good idea for the above practical concerns.
David W.
2009/11/2 Brian Blakely <anewpage.media at gmail.com>
> David,
>
>
> Excellent perspectives, and there are certainly format decisions that have
> to be made as a matter of course, just as there have been for <video/>.
>
> I do not agree with two of your points:
>
> * A static 3D rendering is equal to a 2D bitmap
> * JavaScript is necessary to display 3D content
>
> My brief counter-points:
>
> * 2D bitmaps are only partially compatible with 3D CSS - they are still
> always flat
> * This includes <canvas/>, which is still a 2D bitmap, not actually a 3D
> object
>
> A JavaScript-Only Approach is Inferior Because:
>
> * <canvas/> is being purposed as a viewport into 3D content, a function the
> browser itself should serve
> * 3D HTML/CSS is more facilitative to 3D design work than 3D JavaScript
> alone
> * Using only 3D JavaScript, the code required in order to serve rich user
> interfaces is bandwidth intensive, working against one of the key benefits
> of using web standards
>
>
> Explanation and Supporting Examples
> ----------------------------------------------------
>
> These assumptions are partially the fault of my primordial example, as that
> example's purpose was to illustrate these concepts clearly, not demonstrate
> an application of the technology. The goal of <model/> is not merely to
> serve 3D content, but to allow designers and developers to *lay out web
> content and applications in 3D*. Let's think of this concept as "3D HTML".
>
> <canvas/> is not a solution. It is rendering 3D content inside a viewport,
> when the browser itself should be a viewport to 3D content. One
> alternative, creating a giant <canvas/> and filling it with fallback
> content, is coding twice - not good.
>
> The foundations of 3D CSS (a la Webkit -
> http://webkit.org/blog/386/3d-transforms/) and 3D JavaScript (WebGL/O3D)
> are being laid out, but there is no HTML equivalent to cement a truly 3D
> design platform on the web.
>
> If we draw 3D design to its logical conclusion, rich user interfaces, then
> the usefulness and necessity of 3D HTML becomes more apparent. I will
> support this statement with an advanced example, which will demonstrate the
> inadequacies of 2D design, and the gaps in currently-existing potential
> standards.
>
> DISPLAYING THE SOLAR SYSTEM IN A 3/4 VIEW
> ----------------------------------------------------------------------
>
> The below snippets will illustrate how a page would lay out such an
> interface in three ways: 1) A 2D implementation you will see today; 2) a
> combination of fictional 3D HTML and 3D CSS; 3) only 3D CSS, 3D JavaScript
> and <canvas/>.
>
> On hover, each planet will rotate about its own axis.
>
>
> 2D HTML & CSS
> -----------------------
>
> <style>
>
> ul {
> * Background image of space
> }
> li {
> * Absolutely positioned to correlate perspective
> }
> a {
> * Block
> * Negative indentation, hiding text
> }
> a.(planet name) {
> * Background image of each planet
> * Height/Width of each background image (alternatively a large
> height/width in the anchor definition above, centering each image on X,Y
> axes)
> }
>
> </style>
>
> <h1>The Solar System in 3/4</h1>
> <ul>
> <li>
> <a class="sun" href="sun.html">The Sun</a>
> </li>
> <li>
> <a class="mercury" href="mercury.html">Mercury</a>
> </li>
> <li>
> <a class="venus" href="venus.html">Venus</a>
> </li>
> ...
> </ul>
>
> <script>
> * Slideshow background script attached to each anchor, listening for
> mouseover and mouseout
> </script>
>
>
>
> 3D HTML & CSS (notes in parentheses)
> -----------------------
>
> <style>
>
> div {
> * Background image of space
> }
> ul {
> * Rotate to 3/4 view (We can no longer display a background on this
> element, because it will become wafer-like when rotated; a <model/> will
> maintain its desired shape, as it is really 3D.)
> }
> model {
> (some of the work will already be done for you by the ul rotation)
> * Rotate to proper perspective
> * Translate to desired depth/position
>
> (in the syntax of -webkit-transition and -webkit-rotate, currently in
> use today)
> * transition: rotate 3s ease-out;
> }
> model:hover {
> * rotateY(360deg);
> }
>
> </style>
>
> <h1>The Solar System in 3/4<h1>
> <div>
> <ul>
> <li>
> <a href="sun.html">
> <model src="sun.xml" alt="The Sun" />
> </a>
> </li>
> <li>
> <a href="mercury.html">
> <model src="mercury.xml" alt="Mercury" />
> </a>
> </li>
> <li>
> <a href="venus.html">
> <model src="venus.xml" alt="Venus" />
> </a>
> </li>
> ...
> </ul>
> </div>
>
>
>
> 3D JAVASCRIPT, 2D HTML & CSS
> -----------------------------------------------
>
> <style>
>
> canvas {
> * Height/Width of viewport
> }
>
> </style>
>
> <h1>The Solar System in 3/4</h1>
> <canvas id="solar-system">
> <!-- ALT CONTENT FOR BROWSERS NOT SUPPORTING <canvas/> -->
> (Herein: Code from Example 1)
> </canvas>
>
> <script>
> (the following is a non-custom snippet from O3D's "simple" example --
> webGL's implementation is slightly cleaner)
>
> function loadFile(context, path) {
> function callback(pack, parent, exception) {
> enableInput(true);
> if (exception) {
> alert("Could not load: " + path + "\n" + exception);
> g_loadingElement.innerHTML = "loading failed.";
> } else {
> g_loadingElement.innerHTML = "loading finished.";
> // Generate draw elements and setup material draw lists.
> o3djs.pack.preparePack(pack, g_viewInfo);
> var bbox = o3djs.util.getBoundingBoxOfTree(g_client.root);
> g_camera.target = g_math.lerpVector(bbox.minExtent, bbox.maxExtent,
> 0.5);
> var diag = g_math.length(g_math.subVector(bbox.maxExtent,
> bbox.minExtent));
> g_camera.eye = g_math.addVector(g_camera.target, [0, 0, 1.5 * diag]);
> g_camera.nearPlane = diag / 1000;
> g_camera.farPlane = diag * 10;
> setClientSize();
> updateCamera();
> updateProjection();
>
> // Manually connect all the materials' lightWorldPos params to the
> context
> var materials = pack.getObjectsByClassName('o3d.Material');
> for (var m = 0; m < materials.length; ++m) {
> var material = materials[m];
> var param = material.getParam('lightWorldPos');
> if (param) {
> param.bind(g_lightPosParam);
> }
> }
>
> g_finished = true; // for selenium
>
> // Comment out the next line to dump lots of info.
> if (false) {
> o3djs.dump.dump('---dumping context---\n');
> o3djs.dump.dumpParamObject(context);
>
> o3djs.dump.dump('---dumping root---\n');
> o3djs.dump.dumpTransformTree(g_client.root);
>
> o3djs.dump.dump('---dumping render root---\n');
> o3djs.dump.dumpRenderNodeTree(g_client.renderGraphRoot);
>
> o3djs.dump.dump('---dump g_pack shapes---\n');
> var shapes = pack.getObjectsByClassName('o3d.Shape');
> for (var t = 0; t < shapes.length; t++) {
> o3djs.dump.dumpShape(shapes[t]);
> }
>
> o3djs.dump.dump('---dump g_pack materials---\n');
> var materials = pack.getObjectsByClassName('o3d.Material');
> for (var t = 0; t < materials.length; t++) {
> o3djs.dump.dump (
> ' ' + t + ' : ' + materials[t].className +
> ' : "' + materials[t].name + '"\n');
> o3djs.dump.dumpParams(materials[t], ' ');
> }
>
> o3djs.dump.dump('---dump g_pack textures---\n');
> var textures = pack.getObjectsByClassName('o3d.Texture');
> for (var t = 0; t < textures.length; t++) {
> o3djs.dump.dumpTexture(textures[t]);
> }
>
> o3djs.dump.dump('---dump g_pack effects---\n');
> var effects = pack.getObjectsByClassName('o3d.Effect');
> for (var t = 0; t < effects.length; t++) {
> o3djs.dump.dump (' ' + t + ' : ' + effects[t].className +
> ' : "' + effects[t].name + '"\n');
> o3djs.dump.dumpParams(effects[t], ' ');
> }
> }
> }
> }
> ...
>
> (and on, literally, for pages)
> </script>
>
>
> While the paradigms of HTML are inherently dimensionless, media types are
> not. CSS and JavaScript are embracing 3D in their own ways, HTML is
> obviously not giving its due diligence. Tons of JS just to open a 3D
> viewport in HTML is far from what I would consider a complete spec. The
> wafer-boxes that 3D CSS produce are an ill of HTML, not of CSS.
>
> -Brian MB
>
>
>
> On Mon, Nov 2, 2009 at 4:46 AM, David Workman <workmad3 at gmail.com> wrote:
>
>> I'm in perfect agreement regarding the rational behind having a model tag
>> as I agree with having more semantic tags in HTML. However, I don't think a
>> model tag would work as described as it would provide no real extra benefits
>> and would just confuse document authors.
>>
>> The reason I feel this is basically down to the fact that 3d models don't
>> have a visual representation in the same way that images do. A 3d model file
>> is just a list of data that needs rendering into a 2d image for display.
>> There isn't really a standardised way to do this (not in the same way as
>> with images, with standardised png, jpg, bmp, etc. as well known and
>> commonplace formats with commonplace methods of display), and on top of that
>> it isn't a 3d model you a displaying, but a 2d representation (i.e. an
>> <img>). If the representation is static, it isn't really a 3d model as it's
>> just a 2d image, and if it isn't static then you need scripting support,
>> drawing support, rendering and the whole host of items that require
>> javascript hooks and would logically make such a model more suited to a 3d
>> canvas (which I believe is to be supported eventually under a normal
>> <canvas> tag). As such, I don't see a place for a <model> tag in the current
>> environment as a merely semantic element, and adding more than just
>> semantics to the tag would be overlapping it with other efforts.
>>
>> David W.
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20091102/94ecbab9/attachment-0002.htm>
More information about the whatwg
mailing list