XB PointStream

Releases

A cross-browser JavaScript tool which will emulate Arius3D's PointStream viewer. It will be able to quickly render a large amount of point cloud data to the <canvas> tag using WebGL.
XBPS 0.1
XBPS 0.2
XBPS 0.3
XBPS 0.4
XBPS 0.4.5 [Only Lib | Full]

XB PointStream Dev Links

3D Image Gallery
Blogs
Specifications
LightHouse
Github
Twitter
YouTube Videos

Development Resources

GPU Gems
GPU Gems 2

WebGL Specification
WebGL Cheat Sheet
OpenGLES 2.0 man pages

Occlusion Culling Algorithms

Parser Interface

There will be cases in which users have their own file format which they want to render with XB PointStream (for example, .ARA or .XML). We need to give users the ability to write their own parser and hook it into the library.

Users would write their JavaScript code which would implement the methods below. Once they do that, they would register their parser with the library by passing in an extension and their parser.

The library would then take care of the rest by creating an instance of their parser, call its methods and return a point cloud object.

/*
  Add an event listener to the parser. Once the event occurs, the parser
  will call the associated function and pass in a reference to itself.
 
  The parser needs to pass itself back to the library since the library could
  be working with many parsers simultaneously.

  @param {String} eventName - can be one of the following:
  "onstart" - must occur exactly once       - func(parser)
  "onparse" - must occur one or many times  - func(parser, {"VERTEX":[...], "COLOR":[...], etc...}
  "onfinish" - must occur exactly once      - func(parser)
  "hook" - ?

  @param {Function} func - the function to call when the event occurs.
*/
addEventListener(eventName, func)

/*
  Removes an event listener from being called.

  @param {String} eventName - Name of the event
*/
removeEventListener(eventName)

/*
  Begins to load the resource.

  @param {String} path - path to resource
*/
load(path)

/*
  Get the version of this parser.
 
  @returns {String} parser version
*/
getVersion()

/*
  Get the number of points which have been parsed.

  @returns {Number} the number of points parsed so far by the parser.
*/
getNumParsedPoints()

/*
  Get the total number of points in the point cloud, including points
  which have not yet been parsed.

  @returns {Number} the total number of points in the resource or -1 if unknown.
*/
getNumTotalPoints()

/*
  Get the progress of the parser, how much it has parsed so far.

  @returns {Number} value from 0 to 1 or -1 if unknown.
*/
getProgress()

/*
  The size of the resource in bytes.

  @returns {Number} the number of bytes in the resource or -1 if unknown.
*/
getFileSize()

/*
  This example only demonstrates syntax. It hasn't been tested.
*/

var parser;

function startCallback(parser){
  // started
}

function parseCallback(parser){

  // Get the version string of the parser
  parser.version;

  // Get the number of parsed points so far
  parser.numParsedPoints;

  // Get the total number of points in the point cloud.
  parser.numTotalPoints;

  // Progress of downloading the point cloud between zero and one.
  parser.progress;

  // File size of the resource in bytes.
  parser.fileSize;
}

function finishCallback(){
  // finished
}

// create a hypothetical parser and set the callbacks
parser = new XYZParser({ start: startCallback,
                         parse: parseCallback,
                         end: loadedCallback});
// load some resource
parser.load("pointcloud.xyz");

Performance Issue Ideas

• Spatially partition point cloud into Bounding volume hierarchy and do bounding volume frustum culling
• Do static rendering
• Render low LOD when rotating point cloud
• Push as much as we can to CPU and GPU
• Use progressive "mesh" optimization to render objects if they are far from the camera
• Allow user to control LOD
• Stream point cloud, dynamically create and merge bounding volumes
• Pre-create Bounding volume hierarchy