GoogleVisualr - Word Tree


A word tree depicts multiple parallel sequences of words. It could be used to show which words most often follow or precede a target word (Example: "Cats are...") or to show a hierarchy of terms (Example: a decision tree).

Please refer to Google's documentation for details on Data Format and Configuration Options. However, Methods and Events are not implemented.



In your controller, create the data_table object, set new columns, add row values, then instantiate the chart with configuration options.

  def word_tree

    data_table =
    data_table.new_column("string", "Phrases")
        ['cats are better than dogs'],
        ['cats eat kibble'],
        ['cats are better than hamsters'],
        ['cats are awesome'],
        ['cats are people too'],
        ['cats eat mice'],
        ['cats meowing'],
        ['cats in the cradle'],
        ['cats eat mice'],
        ['cats in the cradle lyrics'],
        ['cats eat kibble'],
        ['cats for adoption'],
        ['cats are family'],
        ['cats eat mice'],
        ['cats are better than kittens'],
        ['cats are evil'],
        ['cats are weird'],
        ['cats eat mice']

    opts   = { wordtree: { format: 'implicit', word: 'cats' } }
    @chart =, opts)


In your view, use the render_chart method to generate JavasScript, during rendering of the view.

  <div id='chart'></div>
  <%= render_chart @chart, 'chart' %>