THE XML3D ARCHITECTURE - DFKI

Preview:

Citation preview

THE XML3D ARCHITECTUREKristian Sons, Felix Klein, Jan Sutter, Philipp Slusallek

<!doctype html>_htmlvlang-benb'_head'vv_title'ThevXML{Kv9rchitecture_;title'vv_scriptvtype-btext;javascriptbvsrc-b00;00;script;xml{d0jsb'_;script'_;head'_body'_divvid-bcontentb'vv_h('$icciovandvSuzanne_;h('

vv_xml{dvactiveView-bodefaultViewbvstyle-bwidth}v244pxIvheight}vk44pxIb'vvvv_defs'

vvvvvv_scriptvid-bcustomMaterialbvtype-btext;javascriptb'vvvvvvvvfunctionvshadeVenvwv{vvvvvvvvvvvarvksv=venv0specular$olorv||vnewvVecV407wIvvvvvvvvvvvarvtxv=venv0texcoord0mulV)4404wIvvvvvvvvvvvarvsweepv=vMath0sinVenv0timev*v0)8wv*vtx0xVwv*v40448Ivvvvvvvvvvvarvpxv=vtx0xVwv+vtx0yVwv*vV(058v*vsweepv+v(04wIvvvvvvvvvvvarvmod9mountv=vVpxv/vk7wv%v{I

vvvvvvvvvvvarvtints4v=vnewvVec{V(:v08:v0)wIvvvvvvvvvvifvVenv0tints4v&&venv0tints40sample)Kwv{vvvvvvvvvvvvtints4v=venv0tints40sample)KVenv0texcoordw0rgbVwvvvvvvvvvv}vvvvvvvvvvvarvtints(v=venv0tint(v||vnewvVec{V0{:v07:v0kwIvvvvvvvvvvvarvtints)v=venv0tint)v||vnewvVec{V0{:v02:v(wIvvvvvvvvvvvarvtintv=vmod9mountv>v)v?vtints)v:vVmod9mountv>v(wv?vtints(v:vtints4IvvvvvvvvvvreturnvnewvShadeVw0diffuseVtint0mulVMath0fractVmod9mountww:venv0normalwvvvvvvvvvvvvvvvvvvvvvvvvvvvv0wardVks:venv0normal:venv0tangent0xyzVw:v40k:v40(wIvvvvvvvv}vvvvvv_;script'

vvvvvv_materialvid-bmyMaterialbvscript-bocustomMaterialb'vvvvvvvv_floatvname-bambientIntensityb'40(_;float'vvvvvvvv_float{vname-bspecular$olorb'408v408v408_;float{'vvvvvvvv_floatvname-btimeb'408_;float'vvvvvvvv_texturevname-btints4bvwraps-brepeatbvwraps-brepeatb'vvvvvvvvvv_imgvsrc-b00;textures;wood0jpgb;'vvvvvvvv_;texture'vvvvvv_;material'

vvvvvv_lightshadervid-blight(bvscript-burn}xml{d}lightshader}spotb'vvvvvvvv_float{vname-bintensityb'(v(v(_;float{'vvvvvvvv_float{vname-battenuationb'(v4v404447_;float{'vvvvvvvv_boolvname-bcastShadowb'true_;bool'vvvvvv_;lightshader'

vvvvvv_datavid-bmesh_databvcompute-btangentv-vxflow0calculateTangentsVindex:vposition:vnormal:vtexcoordwb'vvvvvvvv_datavsrc-b00;00;resources;meshes;suzanne0blstb'_;data'vvvvvv_;data'

vvvvvv_transformvid-bt_Suzannebvtranslation-b6(5v)v(8bvrotation-b(v4v4v6)0)bvscale-bkvkvkb'_;transform'

vvvv_;defs'

vvvv_groupvstyle-bmaterial}vurlVomyMaterialwb'vvvvvv_meshvtype-btrianglesbvtransform-bot_Suzannebvonclick-balertVzHi:vmyvnamevisvSuzanne.zwIb'vvvvvvvv_datavsrc-bomesh_datab'_;data'vvvvvvvv_float{vname-btints(b'407v404v40)_;float{'vvvvvv_;mesh'vvvvvv_group'

vvvvvvvv_modelvsrc-b00;00;resources;assets;robots;ciccio0xmloassetb'vvvvvvvvvv_assetdatavname-banimationb'vvvvvvvvvvvv_floatvname-bkeyb'408_;float'vvvvvvvvvv_;assetdata'vvvvvvvv_;model'

vvvvvv_;group'vvvv_;group'vvvv_groupvstyle-btransform}vvtranslate{dV6)4px:vk4px:v4pxwvrotateXV6,4degwvrotateYV6{4degwIb'vvvvvv_lightvshader-bolight(b'_;light'vvvv_;group'vvvv_viewvid-bdefaultViewb'_;view'

vv_;xml{d'vv_scriptvtype-btext;javascriptb'vvvv// Keyframe animation with jQueryvvvv1Vbxml{dbw0onVbframedrawnb:vfunctionvVewv{vvvvvvvarvkeyv=vcomputeKeyframeVewIvvvvvv1Vz#[name-key]zw0textVkeywIvvvv}wIvv_;script'_;div'_;body'_;html'

HTML5XML(D1is1an1extension1to1HTML'1that1allows1describing1interactive1(D1graphicsin1any1Web1pageP

XML3DThe1XML(D1scene1description1[I]1is1emGbedded1inside1HTML1using1the14xml(d21tag1which1is1fully1styleable1with1CSSP

GENERIC DATAXML(D1has1a1generic1approach1to1dataPUsers1can1define1named1and1typed1data1entries1that1can1be1used1ePgP1as1mesh1attributesz1material1parametersz1or1with1XflowPThe1combined1data1entries1defined1by1the14data21tag1can1be1reusedz1specialized1and1composed1from1multiple1sourcesP1The1entries1defined1in14data21elements1can1be1mapped1directly1to1GPU1buffers1in1WebGLP

DEFINITION AREAThe14defs21area1is1adopted1from1SVGR1Itdefines1content1to1be1referenced1and1reusedlaterP

HTML ELEMENTSXML(D1reuses1existing1HTML1element1and1concepts1wherever1possibleP

HIERARCHY4group21elements1define1the1scene1hierGarchy1in1the1DOM1treeP1Materials1and1transGformations1can1be1applied1to1entire1groupshierarchicallyP

TRANSFORMATIONSXML(D1provides1three1ways1to1define1transGformationsR1Via1CiS1CSSz1CiiS1by1referencing1a4transform21elementz1or1CiiiS1through1anXflow1graph1that1defines1a1data1entry1named1ftransformfP

LIGHTSLights1are1first1level1objects1in1the1scenehierarchyP1Light1definitions1can1be1reusedreferencing1a1light1shaderP

ASSET INSTANCINGAssets1can1be1externally1defined1and1inGstanced1multiple1times1within1a1scene1[']PEach1instance1can1be1specialized1by1overGriding1values1from1the1instancing1documentPAssets1can1reference1other1assets1recursivelywhile1maintaining1full1configurabilityP

VIEWSViews1define1camera1parameters1within1thescene1hierarchyP1The1currently1active1view1isdefined1via1the1factiveViewf1attribute1of1the14xml(d21elementP

POLYFILLJust1add1a1single1script1to1your1web1page1to1enable1XML(D1in1the1browserP1The1Polyfill1implementation1[(]1uses1WebGL1and1JavaGScript1to1emulate1native1XML(D1supportP

REFERENCESIn1XML(D1all1resources1can1be1referenced1by1a1URIP1A1resource1is1predefined1CePgP1oftenused1light1and1material1modelsSz1defined1within1the1same1document1or1in1anexternal1resourceP

BLASTBLAST1[)]1is1a1novel1transmission1format1for1binary1resourcesP1It1is1streamable1and1offersa1flexible1approach1to1compression1based1on1a1codeGonGdemand1approachP

SHADE.JSWith1shadePjs1[j]z1developers1can1write1portGable1materials1using1JavaScriptP1It1is1renderer1agnosticz1adaptive1and1compiles1to1GLSL1for1forward1and1deferred1rendering1viaOpenGL1but1can1also1compile1to1ePgP1OSL1for1ray1tracing1and1global1illuminationP

XFLOWXflow1[O]1is1a1declarative1approach1to1deGfine1composable1data1resources1as1well1as1processing1on1this1data1via1a1dataflow1graphP1It1can1be1used1for1geometry1procesGsing1CePgP1skinning1and1morphingSz1animationz1image1processing1CePgP1postprocessing1and1ARSz1and1othersP1Its1declarative1approach1allows1mapping1computations1to1the1GPU1and1other1parallel1processors1via1differentsupported1APIs1CePgP1WebGLz1WebCLz1ParallelJSz1SIMDPjsSP

CSSCSS1can1be1used1to1style1XML(D1elementszePgP1to1define1transformations1on1groups1using1CSS(1(D1transformsP

SPECIALIZATIONSpecialization1of1reusable1resources1is1ageneral1concept1in1XML(D1that1is1achievedwith1partial1overridesP1Assetsz1materialsz1meshes1and1data1in1general1can1be1specializedP

EVENT ATTRIBUTESSimilar1to1HTMLz1XML(D1defines1eventsfor11elements1in1the1scene1graph1like1startGing1a1JavaScript1when1the1user1clicks1on1anelementP

JAVASCRIPTJavaScript1can1modify1the1web1page11G1andthus1the1(D1scene1G1arbitrarily1by1modifyingthe1DOMP1Any1of1the1numerous1DOM1libraries1can1be1usedz1ePgP1jQueryP

Renderer-Independent Dynamic Scenes Large ScenesProgrammable Materials

[6]gXML3D:gInteractiveg3DgGraphicsgforgthegWebKristianCSons;CFelixCKlein;CDmitriCRubinstein;CSergiyCByelozyorov;CPhilippCSlusallekIn:6Proceedings6of6the615th6International6Conference6on6Web63D6Technology46Web3D62)1)

[2]gXflow:gDeclarativegDatagProcessinggforgthegWebFelixCKlein;CKristianCSons;CStefanCJohn;CDmitriCRubinstein;CSergiyCByelozyorov;CPhilippCSlusallekIn:6Proceedings6of6the617th6International6Conference6on6Web63D6Technology46Web3D62)12

[3]gxml3dFjs:gArchitecturegofgagPolyfillgImplementationgofgXML3DKristianCSons;CChristianCSchlinkmann;CFelixCKlein;CDmitriCRubinstein;CPhilippCSlusallekIn:6Proceedings6of6the66th6Workshop6on6Software6Engineering6and6Architectures6for6Realtime6Interactive6Systems46SEARIS62)13

[4]gBlastgTgAgBinarygLargegStructuredgTransmissiongFormatgforgthegWebJanCSutter;CKristianCSons;CPhilippCSlusallekIn:6Proceedings6of6the619th6International6Conference6on6Web63D6Technology46Web3D62)14

[5]gConfigurablegInstancesgofg3DgModelsgforgDeclarativeg3DgingthegWebFelixCKlein;CTorstenCSpieldenner;CKristianCSons;CPhilippCSlusallekIn:6Proceedings6of6the619th6International6Conference6on6Web63D6Technology46Web3D62)14

[6]gshadeFjs:gAdaptivegMaterialgDescriptionsKristianCSons;CFelixCKlein;CJanCSutter;CPhilippCSlusallekIn:6Computer6Graphics6Forum6RProceedings6of6Pacific6Graphicsm4633R7m462)14

SEE ME

RUNNING

Recommended