1. NodeBox 1
    1. Homepage
    2. NodeBox 3Node-based app for generative design and data visualization
    3. NodeBox OpenGLHardware-accelerated cross-platform graphics library
    4. NodeBox 1Generate 2D visuals using Python code (Mac OS X only)
  2. Gallery
  3. Documentation
  4. Forum
  5. Blog

Grid and Wikipedia content

Posted by Chris on Jul 31, 2008

I love the new grid library!

I'm trying to integrate it with a project I was working on some months ago making printed material from Wikipedia content using the web library.

I wonder if anyone has any ideas about converting wiki content from the web library to grid.content format.

Thanks


 
Posted by Tom De Smedt on Aug 04, 2008

Here is a simple example to get you started:

web = ximport("web")
article = web.wikipedia.search("flat earth")
 
grid = ximport("grid")
g = grid.create(2, 1, 500, 500)
g.styles.default.padding = 5
 
g.top.content = article.title
g.top.relative_height = 0.2
g.top.style = "header"
s = g.styles.create("header")
s.fit = True
 
g.bottom.split(1, 3)
g.bottom.content = ""
for paragraph in article.paragraphs:
    g.bottom.content += "\n\n"+unicode(paragraph.title)
    g.bottom.content += "\n\n"+unicode(paragraph)
 
g.draw()
Now your next question will likely be: how do I style the title of each individual paragraph? I've been thinking about this the last days.

One way would be to create a new grid cell for each title, and style that. However, a lot of unused whitespace would propagate between all these cells, so the Grid library would need something like a new cell.pack() method that shrinks a cell' size to fit exactly around the content. That's doable, but I'll have to think about it first...

Another solution would be if the text() command in NodeBox could handle different fonts/sizes/colors for individual words in a text. That's a feature we should've implemented years ago, but for some reason still isn't there.

So right now, you'll have to do some juggling with layout... Here's my test, with a new column for each paragraph:
web =  ximport("web")
article = web.wikipedia.search("flat earth")
 
grid =  ximport("grid")
g = grid.create(2, 1, 2000, 500)
g.styles.default.padding = 5
 
g.top.content = article.title
g.top.relative_height = 0.2
g.top.style = "header"
s = g.styles.create("header")
s.fit = True
 
g.bottom.split(2, len(article.paragraphs))
g.bottom.top.relative_height = 0.1
for i in range(len(article.paragraphs)):
    paragraph = article.paragraphs[i]
    g.bottom.column(i).top.content = unicode(paragraph.title)
    g.bottom.column(i).bottom.content = unicode(paragraph)
 
g.draw()

  

Posted by Chris on Aug 07, 2008

Thanks for your suggestions. I'm going to mull it over and see if I come up with anything.

Since my goal is to have flowing text, I'm leaning towards your first example. I'm going to look at the grid library code and possibly extend the content drawing methods to allow for more granular stylistic control of wikipedia content types.

I'll post if I come up with anything good.