Graphical JavaScript: Raphael, SVG, 3D visualization and HTML5

This is a must-see for graphics nerds. We're gonna be all up in the SVG and HTML5 canvas!

Atomistic visualization of complex molecules in JavaScript - Monica Berrondo

3D visualization of complex molecules has traditionally been a desktop problem with very few solutions for embedding anything beyond a static image in a web page. One technique used to view the molecules on a web page is through java applets which require users to have the necessary plugin installed.

http://photos2.meetupstatic.com/photos/event/b/c/0/e/event_99528142.jpegUsing HTML5's canvas element, I have created a purely JavaScript version of a molecular viewer that allows you to view, rotate, and scale molecules in different renderings. Atoms that are bonded are represented by the lines that connect them. For complex biomolecules, there is an element beyond 3D visualization of the atom points and bond lines. Traces of the overall structure of such biomolecules are rendered using splines to show connections. The 3D effects are achieved through lighting and coloring, as well as the ability to rotate and see how these aspects change.

Raphael + Backbone + Traer - Nick Gauthier

Raphael.js (http://raphaeljs.com/) is a cool vector graphic drawing library for javascript. It uses SVG (VML on IE) to draw just about anything, and provides lots of easy helper methods. The coolest thing about SVG is that since it's XML it can be inserted directly into the dom, so every element has its own dom node.

One of my favorite things about Backbone.js (http://documentcloud.github.com/backbone/) is that the only assumption it makes about Views is that they will have a dom element, el. So, I thought it would be really cool if you used a Backbone.js view to render Raphael objects.

6:00 - Social time (meet some peeps)

6:15 - Lightning Talk - Contact Jonathan or Shea to speak!

6:30 - Atomistic visualization of complex molecules in JavaScript - Monica Berrondo

7:00 - QA & Break

7:15 - Raphael + Backbone + Traer - Nick Gauthier

7:45 - QA

8:00 - Ping pong, etc

Hungry?

Food will be provided - exact type TBD. Some cold beverages as well.

Lightning Talks

Do you have something you'd like to share? A new library, a cool project, or just need a soapbox to rant from? We're making time for multiple 5-minute lightning talks at the beginning of every meetup. Email the organizers and we'll add you to the schedule.

Location: Advertising.com in Tide Point

Advertising.com (http://www.advertising.com/) has offered their space to us for our meetups, it's located in Tide Point in the Ivory Building.

If you bike over, feel free to bring your bike inside, or lock up on one of the outdoor racks. You can also take the water taxi over from Fells Point (landing #8) to landing #10.

Parking

If you drive, park in one of the Green or Purple areas:

http://i.imm.io/eJBK.png

Green is designated visitor spaces, they are also marked "visitor" on the pavement. Do not park in 'reserved' or 'handicap' (unless you have a permit). Purple is the employee lot which is also available for us.

The Blue marker is the entrance to the Advertising.com meeting space on Haubert St.

View AOL Meetup Location (https://maps.google.com/maps/ms?msid=207385163370510247449.0004b6ad38105d5969be2&msa=0&ie=UTF8&t=h&vpsrc=0&source=embed&ll=39.274632,-76.589615&spn=0.003335,0.005879) in a larger map