Introducing <axis-viewport>
The <axis-viewport> HTML element allows for using Axis and displaying 3D content on a web page purely by using HTML, without explicit need for scripting. It can be used just as any HTML element in the web page.
As of Feb 16 2018, <axis-viewport> is supported by Chrome, Opera and Safari 10.1 and above. It is expected to be supported in Firefox version 60/61 and soon in Edge.
Firefox can be manually tuned to display the Axis element. To do that, start Firefox, go to page address about:config, find dom.webcomponents.customelements.enabled and set it to true
For details, check out the HTMLAxisViewportElement page
See a live demo on the 3D page in under 10 lines
Attributes of <axis-viewport>
- src - a string representing the 3d scene file which is to be rendered, for example src="Resources/My3DScene.axs".
It can also represent an expression that returns an AxStream object which contains a scene, for example src="getMy3DScene();". This is useful when loading s scene in a .js format, see Axis JS serialization format.
- oninitialize - An expression which gets evaluated once in the life time of the element, after it has initialized and ready to work.
- onload - An expression which gets evaluated each time a scene is successfully loaded by the element.
- onrender - An expression which gets evaluated each time a frame is rendered.
- scrollingenabled - A Boolean which denotes whether to allow the page scrolling and the default browser actions when user interacts with the element.
- contextmenuenabled - A Boolean which denotes whether to allow the browser's default context menu to be enabled for the element
- defaultcontrols - A Boolean which denotes whether to allow the default scene control actions from user input
- orbit - A Boolean which denotes whether to allow the default camera orbiting action from user input
- rotate - A Boolean which denotes whether to allow the default camera rotation action from user input
- pan - A Boolean which denotes whether to allow the default camera panning action from user input
- zoom - A Boolean which denotes whether to allow the default camera zooming action from user input
*More attributes will be added in future versions.
New API and content
- Added the HTMLAxisViewportElement
- Added function QueryDocumentLoadedCallback in HTMLAxisViewportElement.js
- Added method Axis.Reset
- Constructor of AxAnimationElement can now accept for its canvas parameter either an ID of a canvas element or a canvas object
- Function AxisInitialize is now invoked automatically and does not have to be manually handled any more
Fixes and improvements
- AxAnimationElement touchScrollingEnabled constructor parameter and member variable of the same name now affect mouse input as well as touch input
- AxAnimationElement now handles mouse wheel
- AxHtmlCanvasInputDevice has increased number of maximum touch points from 4 to 5
Optimizations
- Faster AxMemoryStream operations
- Improved scene loading time
- Quicker textures loading
|