DailyJS

godzi-webgl, paper.js, Liquid Galaxy WebGL Demo

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

graphics canvas maps webgl

godzi-webgl, paper.js, Liquid Galaxy WebGL Demo

Posted by Alex R. Young on .
Featured

graphics canvas maps webgl

godzi-webgl, paper.js, Liquid Galaxy WebGL Demo

Posted by Alex R. Young on .

godzi-webgl

godzi-webgl (License: LGPL v3) by Glenn from Pelican Mapping is an SDK for building WebGL maps.
The ReadyMap Web SDK supports 2D and
3D maps -- the 2D maps look like the familiar maps we've seen on the web
before, while the 3D maps are rendered on a globe that can be rotated
and populated with geographical data.

There's a list of ReadyMap SDK
demos
that
includes many examples of the possibilities the current implementation
offers.

The company's website at
pelicanmapping.com has more details behind the SDK and associated services:

Pelican Mapping is the creator and maintainer of the osgEarth and ReadyMap SDK open source projects. These are powerful, “on-demand” 3D terrain engines capable of providing an interactive, 3D globe populated with a variety of local or web-based data sources.

paper.js

paper.js (GitHub: paperjs / paper.js,
License) by Juerg Lehni and Jonathan Puckey is a "vector graphics scripting
framework" that uses Canvas. It's designed to be mostly compatible with
Scriptographer, which is a scripting environment for Adobe Illustrator.

It comes packed with features:

  • Simple scene graph
  • Paths and segments
  • Mouse and keyboard handling
  • Bitmap colour processing
  • Selection outlines
  • Vector geometry abstraction
  • Mathematical operations

One thing I like about the API is the ability to use arrays or simple
objects:

var rect = new Rectangle({ x: 10, y: 20, width: 100, height: 200 });
console.log(rect); // { x: 10, y: 20, width: 100, height: 200 }

// Define the size as an array containing [width, height]:
rect.size = [200, 300];
console.log(rect); // { x: 10, y: 20, width: 200, height: 300 }

There's a good set of paper.js
tutorials
which cover everything from
paths and geometry to animations and rasters.

WebGL Tron Tank on Liquid Galaxy WebGL Demo

SceneJS Tron Tank is a WebGL demo from
SceneJS
,
except it's running on 5 tiled screens:

This is a hack to see if WebSocket/WebGL is viable for achieving view synchronisation on immersive multi-machine visualisation rigs. The test rig is a 5 screen curved tile-wall at the University of Western Sydney based on Google's Liquid Galaxy.