Drawing shapes in Bokeh


After an
amazing presentation in last PyCon Montreal (Sarah Bird), I decided to start a small project using bokeh

My project
is to create an interactive drum volume calculator. The idea is to have an
image (a vertical drum) and three inputs (vessel dimensions: diameter, length
and liquid level). Then, based on that info, the calculator will estimate the
total volume; the partial volume (up to the liquid level) and the image will be
updated to reflect the new level (i.e. part
of the drum will turn blue, up to some height).

The drum image
will have 3 sections (bottom head, top head and cylinder) and if I tap in any
of them I will get the volume corresponding to the section (or 0 if there is no
liquid level).

While the
calculation itself is pretty simple (I have ready the python script that will
perform all calcs required and will return any volume requested), presenting
the results is kind of tricky and I would appreciate some direction/comments
based on your experience.

My first
problem is how to draw the image in the calculator. I was thinking of two approaches:

  1. Draw
    each section in a different program (i.e inkscape) and then importing each
    section as an image. The problem would be to indicate the position of each
    section relative to the others, in order to make the drawing consistent (one drum
    instead of a bunch of shapes), and it would be also a problem how to change the
    color of one section to indicate the level. Finally, it seems like the imported
    images are kind of ugly in bokeh.

  2. Draw
    each section using the glyph “paths” based on x,y arrays for each one
    (similar to how the maps are constructed). The problems here is getting the x,y
    coords. So far, the only way that I know to do it is uploading the image to a mouse
    tracking program (http://www.mobilefish.com/services/record_mouse_coordinates/record_mouse_coordinates.php)
    and then clicking on different points to create the polygon. Draw a cylinder is
    ok but the two heads are kind of messy unless you’re really really careful with
    the clinking.

I believe I
will use the second approach but I would appreciate any comment/suggestion.