Dart + WebGL: Simple demo

During the first global Dart Hackathon 2012 in Prague I was a member of a team that created this simple application called Dart Music. It's basically Audio API with Canvas, but as an by-product I created a simple demo combining Dart with WebGL, because we wanted to render some animations and we thought that canvas will be too slow for this. It later turned out that we wouldn't be able to write WebGL renderer so quickly and switched to the standard Canvas 2D Context.

Updated: March 11th 2013 - Dart SDK 0.4.1

Live demo

Anyway, WebGL in Dart really works and it's more or less the same like writing WebGL in pure JavaScript. This demo is written in Dart and compiled into JavaScript (and tested in Chrome 18 and Firefox 11).

Source code

Look at this Gist on GitHub or copy & paste source codes below.

HTML template is straight forward, the only important things are `canvas` which is used by WebGL to render graphics and compiled Dart source code in `dart-webgl-demo.dart.js`.

All classes in this example are standard part of Dart API, althought there's almost no documentation available in Dart API Reference (May 1st 2012).

Just one note here, this example is tailor-made for 2D graphics. For 3D it would be necessary to include some matrix processing library like glmatrix for Dart.

What next?

I think there are no tutorials on using Dart + WebGL at this moment, but you can have a loot at learningwebgl.com and try to rewrite some of them into Dart.

If you find some nice application or game using Dart + WebGL, please leave me a comment! I'd love to see it in action.

blog comments powered by Disqus