Ejecta is a fast, open source JavaScript, Canvas & Audio implementation for iOS. Think of it as a Browser that can only display a Canvas element.
More info & Documentation: http://impactjs.com/ejecta
Ejecta is published under the MIT Open Source License.
The canvas.MSAAEnabled
and canvas.MSAASamples
properties have been removed. Instead, you can now specify antialias settings in a separate options object when calling getContext()
, similar to how it works in a browser. Antialias now works on 2D and WebGL contexts.
Note that for 2D contexts antialias will have no effect when drawing images, other than slowing down performance. It only makes sense to enable antialias if you draw shapes and paths.
var gl = canvas.getContext('webgl', {antialias: true, antialiasSamples: 4});
// Or for 2d contexts
var ctx = canvas.getContext('2d', {antialias: true, antialiasSamples: 4});
The Canvas' backing store is now exactly the same size as the canvas.width
and canvas.height
. Ejecta does not automatically double the internal resolution on retina devices anymore. The ctx.backingStorePixelRatio
and canvas.retinaResolutionEnabled
properties as well as the HD
variants for the ctx.getImageData
, ctx.putImageData
and ctx.createImageData
functions have been removed.
You can of course still render in retina resolution, by setting the width
and height
to the retina resolution while forcing the style
to scale the canvas to the logical display resolution. This is in line with current browsers.
canvas.width = window.innerWidth * window.devicePixelRatio;
canvas.height = window.innerHeight * window.devicePixelRatio;
canvas.style.width = window.innerWidth + 'px';
canvas.style.height = window.innerHeight + 'px';
// For 2D contexts you may want to zoom in afterwards
ctx.scale( window.devicePixelRatio, window.devicePixelRatio );
Recently WebGL support has been merged into the main branch. A huge thanks goes to @vikerman - he did most of the grunt work of the WebGL implementation. To have the WebGL alongside Canvas2D, I modified the old 2D implementation to use OpenGL ES2 instead of ES1, just like WebGL itself.
Ejecta always creates the screen Canvas element for you. You have to hand this Canvas element over to Three.js instead of letting it create its own.
renderer = new THREE.WebGLRenderer( {canvas: document.getElementById('canvas')} );
- Create a folder called
App
within this XCode project - Copy your canvas application into the
App
folder - Ensure you have at least 1 file named
index.js
- Build the XCode project
For an example application, copy ./index.js
into the App
folder. An example App folder with the Three.js Walt CubeMap demo can be found here: