Downloaded 75 times
![FICTION INVESTIGATION…
Shane
Bergsma’s
db
of
noun
gender
(based
on
Google
news
crawling):
[see
refs]
“word
male
female
neutral
plural”,
e.g.:
publication
93
20
3152
110
1. Load
Shane’s
db
into
redis
2. Convert
books
to
txt
(blank
line
bw
paragraphs)
3.
Extract
nouns
with
pattern.py
4. Code
each
with
tuple
(m,
f,
n)
&
%’s
5. Write
out
as
csv
for
use
in
Nodebox
scripts](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/85/Nodebox-for-Data-Visualization-37-320.jpg)
![INTERPOLATION
You
often
need
to
map
from
a
data
range
to
another
range
(of
pixels,
or
color
points…).
Mapping
my
X
and
Y
to
colors:
from scipy.interpolate import interp1d
hue_scale = interp1d([0,1],[.67,1])
For
pythonic
hsv
color
and
then
nodebox
rgb:
hsv = (hue_scale(x)[0], 1, 1-y[0])
rgb = Color(colorsys.hsv_to_rgb(*hsv))
I
am
flipping
the
V!](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/85/Nodebox-for-Data-Visualization-41-320.jpg)
![MOUSE & KEYBOARD EVENTS
mouse
=
canvas.mouse
mouse.x
#
Horizontal
position.
mouse.y
#
Vertical
position.
NB
OGL:
h3p://www.cityinabo3le.org/nodebox/
mouse.relative_x
#
Relative
(0.0-‐1.0)
to
Canvas.width.
mouse.relative_y
#
Relative
(0.0-‐1.0)
to
Canvas.height.
mouse.dx
#
Drag
distance
from
previous
x.
mouse.dy
#
Drag
distance
from
previous
y.
mouse.pressed
#
True
if
the
mouse
button
is
pressed.
mouse.dragged
#
True
if
the
mouse
is
dragged.
mouse.cursor
#
DEFAULT,
CROSS,
HAND,
HIDDEN,
TEXT,
WAIT
mouse.button
#
LEFT,
RIGHT,
MIDDLE
mouse.modifiers
#
List
of:
CTRL,
SHIFT,
OPTION
keys
=
canvas.keys
keys[]
#
All
keys
pressed
(SHIFT
+
"a"
=>
[SHIFT,
"a"]).
keys.char
#
Last
key
pressed
(SHIFT
+
"a"
=>
"A").
keys.code
#
Last
key
pressed
(SHIFT
+
"a"
=>
"a").
keys.modifiers
#
List
of
modifier
keys
(CTRL,
SHIFT,
OPTION).
keys.pressed
#
True
if
a
key
is
pressed
on
the
keyboard.](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/85/Nodebox-for-Data-Visualization-45-320.jpg)
![FICTION INVESTIGATION…
Shane
Bergsma’s
db
of
noun
gender
(based
on
Google
news
crawling):
[see
refs]
“word
male
female
neutral
plural”,
e.g.:
publication
93
20
3152
110
1. Load
Shane’s
db
into
redis
2. Convert
books
to
txt
(blank
line
bw
paragraphs)
3.
Extract
nouns
with
pattern.py
4. Code
each
with
tuple
(m,
f,
n)
&
%’s
5. Write
out
as
csv
for
use
in
Nodebox
scripts](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/75/Nodebox-for-Data-Visualization-37-2048.jpg)
![INTERPOLATION
You
often
need
to
map
from
a
data
range
to
another
range
(of
pixels,
or
color
points…).
Mapping
my
X
and
Y
to
colors:
from scipy.interpolate import interp1d
hue_scale = interp1d([0,1],[.67,1])
For
pythonic
hsv
color
and
then
nodebox
rgb:
hsv = (hue_scale(x)[0], 1, 1-y[0])
rgb = Color(colorsys.hsv_to_rgb(*hsv))
I
am
flipping
the
V!](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/75/Nodebox-for-Data-Visualization-41-2048.jpg)
![MOUSE & KEYBOARD EVENTS
mouse
=
canvas.mouse
mouse.x
#
Horizontal
position.
mouse.y
#
Vertical
position.
NB
OGL:
h3p://www.cityinabo3le.org/nodebox/
mouse.relative_x
#
Relative
(0.0-‐1.0)
to
Canvas.width.
mouse.relative_y
#
Relative
(0.0-‐1.0)
to
Canvas.height.
mouse.dx
#
Drag
distance
from
previous
x.
mouse.dy
#
Drag
distance
from
previous
y.
mouse.pressed
#
True
if
the
mouse
button
is
pressed.
mouse.dragged
#
True
if
the
mouse
is
dragged.
mouse.cursor
#
DEFAULT,
CROSS,
HAND,
HIDDEN,
TEXT,
WAIT
mouse.button
#
LEFT,
RIGHT,
MIDDLE
mouse.modifiers
#
List
of:
CTRL,
SHIFT,
OPTION
keys
=
canvas.keys
keys[]
#
All
keys
pressed
(SHIFT
+
"a"
=>
[SHIFT,
"a"]).
keys.char
#
Last
key
pressed
(SHIFT
+
"a"
=>
"A").
keys.code
#
Last
key
pressed
(SHIFT
+
"a"
=>
"a").
keys.modifiers
#
List
of
modifier
keys
(CTRL,
SHIFT,
OPTION).
keys.pressed
#
True
if
a
key
is
pressed
on
the
keyboard.](https://image.slidesharecdn.com/nodeboxvisualization-130327122839-phpapp02/75/Nodebox-for-Data-Visualization-45-2048.jpg)
Uploaded byLynn Cherny
Nodebox for Data Visualization
The document provides an overview of Nodebox, a data visualization tool that utilizes Python for creating graphics and animations. It discusses various features, including context management, drawing basics, event handling, and the challenges of importing libraries. The advantages of using Nodebox for data visualization as opposed to other tools like Matplotlib are highlighted, alongside limitations regarding 3D support and web integration.
More Related Content
![[shaderx5] 3.2 Selective Supersampling](https://cdn.slidesharecdn.com/ss_thumbnails/32selectivesupersampling-100323212600-phpapp02-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Similar to Nodebox for Data Visualization
Nodebox for Data Visualization
- 1. NODEBOX FOR DATAVISUALIZATION Lynn Cherny for PyData 2013 @arnicas www.ghostweather.com
- 2.
- 3.
- 4. FLOCK EXAMPLE Take that , ma tplo tlib ( ?!) h3p://www.cityinabo3le.org/nodebox/ Flock_example.py
- 5. NODEBOX OPENGL from nodebox.graphics import * def draw(canvas): canvas.clear() nofill() Set context values stroke(0, 0.25) strokewidth(1) X, Y, width, height Local override of context rect( 50, 50, 50, 50) values rect(110, 50, 50, 50, stroke=Color(0), strokestyle=DASHED) rect(170, 50, 50, 50) canvas.run(draw) 0,0 in lower leB by default (top leB in NB 1!)
- 6. NODEBOX 1 ISA SMART IDE Implicit canvas, draw, etc.
- 7. DOWNLOAD NODEBOX Mac too, I’ll TentaQve evidence demo of linux too http://nodebox.net/download/
- 8. GENERATIVE ART JusQn D on flickr.
- 10. HIGH QUALITY GRAPHICOUTPUT TODO.TO.IT
- 12. LIBRARIES IN NODEBOX1 (MAC OSX) Note: these libraries must be put in ~/Library/Application Support/Nodebox to be imported. All the libs live here.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19. If you do data visualization, but not “art,” WHY WOULD YOU NEED THIS TOOL?
- 20. SKETCHES IN CODE Examples from Processing sketches by JanWillem Tulp
- 22. “Ghost CounQes,” by @JanWillemTulp
- 23. UNUSUAL GRAPH TYPES Slopegraph from Juice Analytics, code for NB 1
- 24. TOOL CREATION My sparklines generator in NB OGL Example sparks.py in NB OGL
- 25. NODEBOX 1 “GUI” Example bars_with_goals.py for NB1
- 26. CLOSEST SIMILAR TOOLS Drawbot (Preceded and inspired Nodebox, MacOSX only) Shoebot (MacOSX), with Spryte for Windows (some examples run unchanged in NB1!) Pythonista on Ipad! Processing (cross platform, includes .js port) (Processing.py by jpheinberg is jython-‐based.)
- 27. PROCESSING LOOKS LIKEJAVA L Plus, obviously, I want Python libs h3p://openprocessing.org/sketch/8941
- 28. Very, very short intro to the concepts… DRAWING BASICS
- 29. NODEBOX 1 PRIMITIVES Most of them in NB OGL Note: no triangle() as in Nodebox OGL; “oval” instead of “ellipse” as in OGL
- 30. SHAPE PRIMITIVES INNODEBOX OGL NOTE: ellipse() not oval() as in NB1
- 31. THE DRAW() LOOP Nodebox 1 can be used for simple static image without animation – no canvas declaration or draw loop needed. (Use speed(<fps>) to turn on the animation.) Nodebox OGL always runs an animation loop in a draw function (you can exit out with a return after canvas.frame==1 in “draw” if you want) mycanvas = Canvas(width=600, height=480) mycanvas.fps = 20 mycanvas.run(draw=draw,setup=setup)
- 32. DRAWING CONTEXT CHANGES State context changers: colormode(), fill(), stroke(), strokewidth(), nofill(), nostroke() font(), fontsize() transform(), translate(), rotate(), scale(), skew() Temporary state changes: push() fill(0) translate(200,200) pop()
- 33. NOTICE THE CONTEXTAGAIN… from nodebox.graphics import * def draw(canvas): canvas.clear() nofill() Set context values stroke(0, 0.25) strokewidth(1) X, Y, width, height Local override of context rect( 50, 50, 50, 50) values rect(110, 50, 50, 50, stroke=Color(0), strokestyle=DASHED) rect(170, 50, 50, 50) canvas.run(draw)
- 34. LEARNING THE “REST” § Examples with both NB 1 and NB OGL distribs: commented and by topic § Tutorials on the NB 1 site § The extensive intro page for NB OGL (that builds off NB1’s api background)
- 35. Getting Real(ly dirty and sketchy) MY TOY EXAMPLES
- 37. FICTION INVESTIGATION… Shane Bergsma’s db of noun gender (based on Google news crawling): [see refs] “word male female neutral plural”, e.g.: publication 93 20 3152 110 1. Load Shane’s db into redis 2. Convert books to txt (blank line bw paragraphs) 3. Extract nouns with pattern.py 4. Code each with tuple (m, f, n) & %’s 5. Write out as csv for use in Nodebox scripts
- 38. COORDINATES IN COLORAND 3-SPACE Neutral Male Female
- 39. FOOTNOTE: HSV INTHE BLUE-RED RANGE / WITH DARKNESS Code borrowed from an example on StackOverflow – tuned to get only hue from blue to red from complete HSV range
- 40. GET CARTESIAN X,Y COORD FROM A TUPLE def to_cart(triple): (m, f, n) = triple x = ( f + n / 2.0) y = math.sqrt(3) * n / 2.0 return x, y Code in my common.py file
- 41. INTERPOLATION You often need to map from a data range to another range (of pixels, or color points…). Mapping my X and Y to colors: from scipy.interpolate import interp1d hue_scale = interp1d([0,1],[.67,1]) For pythonic hsv color and then nodebox rgb: hsv = (hue_scale(x)[0], 1, 1-y[0]) rgb = Color(colorsys.hsv_to_rgb(*hsv)) I am flipping the V!
- 42.
- 43. EVENTS : LAYERS,MOUSE, KEYS Layers in NB OGL are one good way you might handle “mouseover” functionality Layers have their own draw() functionality, and the canvas knows that layer is in focus (under the mouse, via canvas.focus) Mouse events are also handled nicely by canvas.mouse – mouse.x, mouse.y, etc. are available See my example triangle_layers.py
- 44.
- 45. MOUSE & KEYBOARDEVENTS mouse = canvas.mouse mouse.x # Horizontal position. mouse.y # Vertical position. NB OGL: h3p://www.cityinabo3le.org/nodebox/ mouse.relative_x # Relative (0.0-‐1.0) to Canvas.width. mouse.relative_y # Relative (0.0-‐1.0) to Canvas.height. mouse.dx # Drag distance from previous x. mouse.dy # Drag distance from previous y. mouse.pressed # True if the mouse button is pressed. mouse.dragged # True if the mouse is dragged. mouse.cursor # DEFAULT, CROSS, HAND, HIDDEN, TEXT, WAIT mouse.button # LEFT, RIGHT, MIDDLE mouse.modifiers # List of: CTRL, SHIFT, OPTION keys = canvas.keys keys[] # All keys pressed (SHIFT + "a" => [SHIFT, "a"]). keys.char # Last key pressed (SHIFT + "a" => "A"). keys.code # Last key pressed (SHIFT + "a" => "a"). keys.modifiers # List of modifier keys (CTRL, SHIFT, OPTION). keys.pressed # True if a key is pressed on the keyboard.
- 46. LAYERS GOT EVENTSTOO layer.enabled # True => will receive events. layer.pressed # True => mouse pressed on layer. NB OGL: h3p://www.cityinabo3le.org/nodebox/ layer.dragged # True => mouse dragged on layer. layer.focus # True => mouse hovering over layer. layer.on_mouse_enter(mouse) layer.on_mouse_leave(mouse) layer.on_mouse_motion(mouse) layer.on_mouse_press(mouse) layer.on_mouse_release(mouse) layer.on_mouse_drag(mouse) layer.on_mouse_scroll(mouse) layer.on_key_press(keys) layer.on_key_release(keys)
- 47. MOUSEOVER Triangle_layers.py
- 48. A FAILED EXPERIMENTCAN STILL BE FUN… ADDING ANIMATION. Angels & Demons (Brown) Twilight (Meyer) “jade” Pride & Prejudice (Austen) The Secret Agent (Conrad) triangle_bar_uniq.py
- 49. GETTING BLUNTER… 2ON ONE: Doesn’t show much… sigh.
- 50. JUST GET EVENBLUNTER… Centroid of each… a li3le more revealing maybe? Definitely not for publicaQon!
- 51. THERE CAN BEVALUE IN “MISTAKES” WHEN VISUALIZING DATA AT PIXEL LEVEL Thanks to MarQn Wa3enberg and Fernanda Viegas for this observaQon…
- 52. A MORE INTERESTINGMISTAKE… If you don’t filter out duplicate menQons of the same noun….
- 53. Twilight Angels & Demons Triangle_hist_notuniq.py
- 54. Twilight Angels & Demons (uniqued) (uniqued) Triangle_hist_uniq.py
- 55. RATIO OF NOUNSTO UNIQUE NOUNS (AS EXPECTED NOW) Unique Nouns/ Nouns/ Nouns Words Nouns Unique Words Angels & 19546 2842 6.9 151610 7.8 Demons Twilight 18252 1943 9.4 121205 6.6
- 56. Twilight (most repeated) Angels & Demons (most repeated) Line_freqs.py
- 57. HOOKING UP OTHERPYTHON LIBS 1. Load a book into redis by line # 2. Plot dialog vs. exposition in a simple colored bar 3. Use the redis db to see what’s what in the book on rollover! Simple, and very fast!
- 59. DIALOG TO EXPOSITION… Twilight Angels & Demons Secret Agent Pride & Prejudice Moby Dick (Meyer) (Brown) Para groups: 7 Quote_bar_nodb.py
- 60. Phew! That was a lot of stuff. WRAP UP…
- 61. WHY OR WHYNOT NODEBOX? Advantages § Data as “art” – not supported by Matplotlib (or future ggplot2 ports to python) § Data “sketching” – speedy unstructured pics § Animation is basic § Events come along too § You get to write in Python (unlike w/ Processing) § So you can use other Python libs
- 62. BUT… § No 3d (unlike matplotlib) § PDF or SVG Export are required for good print/reuse (available in NB 1, not in NB OGL yet) § No web embedding / js version (unlike processing.js) § Can’t use with IPython notebook (yet) § Challenge of other python libs with NB 1 -‐ sad PYTHONPATH problem in Nodebox 1 (see appendix for tips) § Authors in Leuven more focused on NB 3/Pattern.py than on NB1 / OGL versions. Can we invigorate Nobebox OpenGL? § A general lack of code examples to draw from… hopefully mine will help!
- 63. THAT’S IT -A BIG THANKS! @deepfoo for the reminder of Nodebox1, Tom De Smedt and Frederik De Bleser for email help, @minrk for help, @jsundram for code cleanup advice (not all of which I took), @pwang and #PyData for having me
- 64. Find me @arnicas, www.ghostweather.com blog GET THE CODE FILES HERE! PDF OF THESE SLIDES HERE. Apologies for the import * and the globals… I was following some suggesQons in the demos I looked at which may not have been ideal.
- 65. REFERENCES § JanWillem Tulp Ghost Counties images: http://www.flickr.com/photos/janwillemtulp/sets/72157626612248205/ § Code for ternary plots in python and excel: http://sourceforge.net/projects/wxternary/ and Will Vaughn’s at http://wvaughan.org/ternaryplots.html § Nodebox flickr gallery § Running Nodebox 1 from command line: http://nodebox.net/code/index.php/Console § Pattern.py by Tom de Smedt (a Nodebox original author) § Nodebox authors Tom De Smedt and Frederik De Bleser in Belgium § Shane Bergsma and Dekang Lin, “Bootstrapping Path-‐Based Pronoun Resolution,” In Proceedings of the Conference on Computational Lingustics / Association for Computational Linguistics (COLING/ ACL-‐06), Sydney, Australia, July 17-‐21, 2006. (page w/ db)
- 66. APPENDIX: NODEBOX 1’SIMPORT PATH Custom path, includes its own python (64 bit)… so…. – You can install your packages into NodeBox’s path, ie., ~/ Library/Application Support/NodeBox/ — meaning that you can use them from NodeBox, but not from other scripts… – You can import sys in your NodeBox code and manually modify the sys.path value to add your existing packages… – You can install packages into your system site-‐packages directory, and sym-‐link them from NodeBox’s directory… – You can make NodeBox use your system packages instead of it’s own by sym-‐linking ~/Library/Application Support/ NodeBox to your site-‐packages directory of choice (ex., / Library/Python/2.5/site-‐packages) – Some flavor of above plus VIRTUALENV Tips from h3p://www.eriksmar3.com/blog/archives/747 Thread here too: h3p://nodebox.net/code/index.php/shared_2008-‐09-‐04-‐01-‐42-‐29
- 67. APPENDIX: NODEBOX1 ATCOMMAND LINE… § Instructions and samples here: http://nodebox.net/code/index.php/Console § Best to use a virtualenv again
- 68. THE NODEBOX “FAMILY” Nodebox 1 Platform & “style” Mac OSX only (kind of Status No longer in dev, spotty URLs Mac OSX Lion file: Lion) – write python code archiving online https://secure.nodebox.net/ (the original) downloads/ in a simple IDE NodeBox-‐1.9.7rc1.zip Home: http://nodebox.net/code/ index.php/Home Github copy of svn source: https://github.com/nodebox/ nodebox-‐pyobjc Nodebox 2 Mac OSX – python visual GONE! Apparently was Home: (the disappeared) programming “blocks” slow and confusing? http://Beta.nodebox.net Nodebox 3 Mac and Windows – no Not so interesting to me: I Home: IDE, no python exposed, want to write python http://nodebox.net/node/ (the current beta) all visual programming? code. Nodebox Mac and Windows – write Not up to date with Home: plain python code Nodebox 1 yet (e.g., lack http://www.cityinabottle.org/ OpenGL (the nodebox/ incomplete) of libraries, lack of Github code: functionality; not so well https://github.com/nodebox/ documented); can’t run in nodebox-‐opengl IPython notebook due to probable multithreading issue(s)