[IPython-dev] interactive widgets with d3 and three.js

Chris Kees cekees at gmail.com
Thu Oct 18 17:59:33 EDT 2012


Hi,

I'm trying to build some interactive representations of geometric
objects (domains of pde's) in the notebook. For now I'm using d3.js
and three.js for the interactive representation and haven't written
any callbacks to actually change the python representations so this
equations is just about display for now. I'm starting with rectangles
and rectangular cuboids. I can't seem to get the objects to display
and interact properly without separating the html from the javascript
like this:

display(d.html) #add a canvas or div element
d.javascript #get the canvas or div element and render to it with
d3.js or three.js

Shouldn't I be able to just stick the javascript in a <script> element
and get the right behavior from d.html? Or should I actually be
grabbing some element id in the javascript and just having the
javascript modify it? It's not really that big of a deal--I'll
probably add and edit() or show() function anyway. I'm more concerned
about straightening out my understanding of how ipython is interacting
with the generated html for a given notebook.

Here is the notebook:
https://github.com/erdc-cm/proteus-notebooks/blob/master/Domain%20Display.ipynb.
 You'd have to either clone my repo + submodules or clone three.js
into your notebook directory in order to run this.

Thanks,
Chris

p.s. I'd be interested in any advice on whether d3.js and three.js are
the way to go.  I would consider just working directly in svg and
webgl. I've done a little of both, and right I'm not quite sure how
much value the libraries add to the core html5 functionality.



More information about the IPython-dev mailing list