An opalized (ruby-fied) wrapper for the dagreD3 directed, acyclic graphing library
Ruby
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
lib
opal
spec
vendor
.gitignore
Gemfile
LICENSE.txt
README.md
Rakefile
config.ru
opal-dagred3.gemspec

README.md

Opal::Dagred3

This wraps the dagre-D3 library, making it much nicer to work with from Opal.rb code. Currently, only wrapping what I need for opal-mikado, but I'd like to see the rest of the library wrapped. I also aspire to wrap all of d3, but both of these may take some time. In the meantime, pull-requests which move in that direction would be most welcome.

Installation

Add this line to your application's Gemfile:

gem 'opal-dagred3'

And then execute:

$ bundle

Or install it yourself as:

$ gem install opal-dagred3

Usage

# opal/application.rb
require "opal"
require "opal-dagred3"

digraph = Dagre::Digraph.new
renderer = Dagre::Renderer.new
layout = Dagre::Layout.new

layout.node_sep = 10
layout.rank_dir = "BT"
layout.edge_sep = 2

svg = `d3.select('svg g')`
digraph.graph(layout.graph.to_n)

digraph.add_node("A", { label: "Some great label A" })
digraph.add_node("B", { label: "Some great label B" })
digraph.add_edge(`null`, "A", "B")

renderer.run(digraph, svg)
/*index.html*/

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Mikado</title>
    <script src="/assets/application.js"></script>
    <style>
    svg {
      border: 1px solid black;
    }

    text {
      font-weight: 300;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serf;
      font-size: 10px;
    }

    .node rect {
      stroke-width: 2px;
      stroke: #333;
      fill: #fff;
    }

    .edgeLabel rect {
      fill: #fff;
    }

    .edgePath path {
      stroke: #333;
      stroke-width: 1.5px;
      fill: none;
    }
    </style>

  </head>
  <body>
    <svg width=1800 height=1600><g transform="translate(20,20)"/></svg>
  </body>
</html>
# config.ru
require 'opal'
require 'bundler'
Bundler.require

run Opal::Server.new { |s|
  s.append_path 'opal'

  s.main = 'application.rb'

  s.index_path = 'index.html'
}

As you can see, this wrapper by itself doesn't buy you much, as this isn't very different from the javascript version, but check out opal-mikado to see where the power of the Ruby programming language makes this much nicer to work with.

Contributing

  1. Fork it ( http://github.com/lonelyplanet/opal-dagred3/fork )
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Add a TEST.
  4. Commit your changes (git commit -am 'Add some feature')
  5. Push to the branch (git push origin my-new-feature)
  6. Create new Pull Request

We love tests at LonelyPlanet, and Pull Requests can not be merged without them, no matter how cool the feature or well-coded. So please write some tests to go with your feature or bug-fix.