MDArray-sol version 0.1.0 has ben release. MDArray-sol, Sol for short, is a front-end platform for desktop application development based on the proprietary (yet free for open source) jxBrowser - https://www.teamdev.com/jxbrowser, a Chromium-based browser.
In a sense, Sol is similar to Opal in that it allows Ruby developers to code for the browser; however, differently from Opal, Sol does not compile its code to javascript, it implements a DSL that interfaces with javascript through jxBrowser java interface, more in line with what is provided by the javascript node-webkit, now called NW.js. To the Ruby developer, no javascript is ever required. Also, since there is no compilation there is no need to 'send' data from Ruby to Javascript. Data in Ruby, for instance, in a Ruby array or hash, is made available directly to the browser.
Since Sol is just a normal Ruby libary, it can be used inside IRB or PRY, without the need of installing a web server to serve javascript. Once mdarray-sol is required, an empty browser window is automatically open and any command in the command line that adds or removes data from the browser will do so interactively, for instance just copy and paste the following lines into IRB or PRY:
- body = $d3.select("body")
- dataset = [ 25, 7, 5, 26, 11, 8, 25, 14, 23, 19, 14, 11, 22, 29, 11, 13, 12, 17, 18, 10, 24, 18, 25, 9, 3 ]
- body.selectAll('div').data(dataset).enter(nil).append('div').style('display', 'inline-block').style('width', '20px').style('background-color', 'teal').style('margin-right', '2px').style('height') { |d, i| (d * 5).to_s + "px" }.on('mouseout') { $d3.select(@this).style('background-color', 'teal') }.on('mouseover') { $d3.select(@this).style('background-color', 'black') }
This is an initial version that focus on the integration of Ruby with the D3.js library. In order to test this integration we have implemented many of the examples of the excellent and highly recommended book by Scott Murray, "Interactive Data Visualization for the Web". As can be seen in the examples directory and on the MDArray-sol wiki at https://github.com/rbotafogo/mdarray-sol/wiki, quite complex behaviour is already possible in this version.
This version was tested on Cygwin, Windows and Linux64. It has not yet been tested on Linux32 nor Mac. Since Sol requires jxBrowser and this is a large download, the browser is not included directly into the RubyGem. However, requiring Sol will check for the appropriate version of the browser and automatically download it.
Bellow is an example of the integration of D3.js with Ruby that plots the US States map:
require 'json'
require 'mdarray-sol'
class Map
attr_reader :path
attr_reader :svg
attr_reader :us_states
#------------------------------------------------------------------------------------
# @param width [Number]: width of the chart
# @param height [Number]: height of the chart
#------------------------------------------------------------------------------------
def initialize(width, height)
@width = width
@height = height
# Create svg for the map
@svg = $d3.select("body")
.append("svg")
.attr("width", @width)
.attr("height", @height)
end
#------------------------------------------------------------------------------------
# Parses a file in GeoJson format and saves it as @us_states
# @param filename [String] the name of the file to parse
#------------------------------------------------------------------------------------
def json(filename)
dir = File.expand_path(File.dirname(__FILE__))
file_name = dir + "/#{filename}"
file = File.read(file_name)
# parse the json file
@us_states = JSON.parse(file)
end
#------------------------------------------------------------------------------------
#
#------------------------------------------------------------------------------------
def plot(projection)
proj = projection
.translate([@width/2, @height/2])
.scale(500)
@path = $d3.geo.path[].projection(proj);
@svg.selectAll("path")
.data(@us_states["features"])
.enter[]
.append("path")
.attr("d", @path)
.style("fill", "steelblue")
end
end
map = Map.new(500, 500)
map.json("us-states.json")
map.plot($d3.geo.albersUsa[])
MDArray-sol is distributed with the BSD 2-clause license; however, MDArray-sol uses JxBrowser http://www.teamdev.com/jxbrowser, which is a proprietary software. The use of JxBrowser is governed by JxBrowser Product Licence Agreement http://www.teamdev.com/jxbrowser-licence-agreement. If you would like to use JxBrowser in your development, please contact TeamDev.
- Integration of Ruby and Javascript transparantly to the Ruby developer
- Data sharing between Ruby and Javascript
- Embedded browser
- Install Jruby
- jruby –S gem install mdarray-sol
Contributors are welcome.
- 2017/01/06: Initial release