In [1]:
require 'daru/view'
Install the spreadsheet gem version ~>1.1.1 for using spreadsheet functions.

Install the mechanize gem version ~>2.7.5 for using mechanize functions.
Out[1]:
true
In [2]:
Daru::View.plotting_library = :highcharts
Out[2]:
:highcharts
In [3]:
data = [[0, 15], [10, -50], [20, -56.5], [30, -46.5], [40, -22.1],
              [50, -2.5], [60, -27.7], [70, -55.7], [80, -76.5]]
    opts = {
      chart:  {
              type: 'spline',
              inverted: true
          },
      title: {
          text: 'Atmosphere Temperature by Altitude'
      },
      subtitle: {
          text: 'According to the Standard Atmosphere Model'
      },
      xAxis: {
          reversed: false,
          title: {
              enabled: true,
              text: 'Altitude'
          },
          labels: {
              formatter: "function () {
                  return this.value + 'km';
              }".js_code
          },
          maxPadding: 0.05,
          showLastLabel: true
      },
      yAxis:{
          title: {
              text: 'Temperature'
          },
          labels: {
              formatter: "function () {
                  return this.value + '°';
              }".js_code
          },
          lineWidth: 2
      },
      legend:{
          enabled: false
      },
      tooltip:{
          headerFormat: '<b>{series.name}</b><br/>',
          pointFormat: '{point.x} km: {point.y}°C'
      },
      plotOptions:{
          spline: {
              marker: {
                  enable: false
              }
          }
      },
    }
Out[3]:
{:chart=>{:type=>"spline", :inverted=>true}, :title=>{:text=>"Atmosphere Temperature by Altitude"}, :subtitle=>{:text=>"According to the Standard Atmosphere Model"}, :xAxis=>{:reversed=>false, :title=>{:enabled=>true, :text=>"Altitude"}, :labels=>{:formatter=>"function () {\n                  return this.value + 'km';\n              }"}, :maxPadding=>0.05, :showLastLabel=>true}, :yAxis=>{:title=>{:text=>"Temperature"}, :labels=>{:formatter=>"function () {\n                  return this.value + '°';\n              }"}, :lineWidth=>2}, :legend=>{:enabled=>false}, :tooltip=>{:headerFormat=>"<b>{series.name}</b><br/>", :pointFormat=>"{point.x} km: {point.y}°C"}, :plotOptions=>{:spline=>{:marker=>{:enable=>false}}}}
In [4]:
chart1 = Daru::View::Plot.new data, opts
Out[4]:
#<Daru::View::Plot:0x007fa1c5a21ea8 @data=[[0, 15], [10, -50], [20, -56.5], [30, -46.5], [40, -22.1], [50, -2.5], [60, -27.7], [70, -55.7], [80, -76.5]], @options={:chart=>{:type=>"spline", :inverted=>true}, :title=>{:text=>"Atmosphere Temperature by Altitude"}, :subtitle=>{:text=>"According to the Standard Atmosphere Model"}, :xAxis=>{:reversed=>false, :title=>{:enabled=>true, :text=>"Altitude"}, :labels=>{:formatter=>"function () {\n                  return this.value + 'km';\n              }"}, :maxPadding=>0.05, :showLastLabel=>true}, :yAxis=>{:title=>{:text=>"Temperature"}, :labels=>{:formatter=>"function () {\n                  return this.value + '°';\n              }"}, :lineWidth=>2}, :legend=>{:enabled=>false}, :tooltip=>{:headerFormat=>"<b>{series.name}</b><br/>", :pointFormat=>"{point.x} km: {point.y}°C"}, :plotOptions=>{:spline=>{:marker=>{:enable=>false}}}}, @adapter=Daru::View::Adapter::HighchartsAdapter, @chart=#<LazyHighCharts::HighChart:0x007fa1c5a21e30 @series_data=[{:type=>nil, :name=>nil, :data=>[[0, 15], [10, -50], [20, -56.5], [30, -46.5], [40, -22.1], [50, -2.5], [60, -27.7], [70, -55.7], [80, -76.5]]}], @options={:chart=>{:type=>"spline", :inverted=>true}, :title=>{:text=>"Atmosphere Temperature by Altitude"}, :subtitle=>{:text=>"According to the Standard Atmosphere Model"}, :xAxis=>{:reversed=>false, :title=>{:enabled=>true, :text=>"Altitude"}, :labels=>{:formatter=>"function () {\n                  return this.value + 'km';\n              }"}, :maxPadding=>0.05, :showLastLabel=>true}, :yAxis=>{:title=>{:text=>"Temperature"}, :labels=>{:formatter=>"function () {\n                  return this.value + '°';\n              }"}, :lineWidth=>2}, :legend=>{:enabled=>false}, :tooltip=>{:headerFormat=>"<b>{series.name}</b><br/>", :pointFormat=>"{point.x} km: {point.y}°C"}, :plotOptions=>{:spline=>{:marker=>{:enable=>false}}}}, @html_options={}, @placeholder="ckapohlewum">>
In [5]:
chart1.show_in_iruby
Out[5]:
In [6]:
# add another chart 
chart1.add_series({
        :data => [[10, 15], [20, -50], [30, -56.5], [40, -46.5], [50, -22.1],
              [55, -2.5], [65, -27.7], [80, -55.7], [90, -76.5]]})
Out[6]:
In [7]:
# add another chart
opts = {
  :type=> 'pie',:name=> 'Total consumption',
  :data=> [
    {:name=> 'Jane', :y=> 13, :color=> 'red'},
    {:name=> 'John', :y=> 23,:color=> 'green'},
    {:name=> 'Joe', :y=> 19,:color=> 'blue'}
  ],
  :center=> [100, 150], :size=> 100, :showInLegend=> false
}
chart1.add_series(opts)
chart1.show_in_iruby
Out[7]:
In [8]:
chart1.chart.class
Out[8]:
LazyHighCharts::HighChart
In [9]:
chart1.chart.series_data
Out[9]:
[{:type=>nil, :name=>nil, :data=>[[0, 15], [10, -50], [20, -56.5], [30, -46.5], [40, -22.1], [50, -2.5], [60, -27.7], [70, -55.7], [80, -76.5]]}, {:data=>[[10, 15], [20, -50], [30, -56.5], [40, -46.5], [50, -22.1], [55, -2.5], [65, -27.7], [80, -55.7], [90, -76.5]], :name=>nil}, {:type=>"pie", :name=>"Total consumption", :data=>[{:name=>"Jane", :y=>13, :color=>"red"}, {:name=>"John", :y=>23, :color=>"green"}, {:name=>"Joe", :y=>19, :color=>"blue"}], :center=>[100, 150], :size=>100, :showInLegend=>false}]
In [10]:
chart1.chart.series_data[2]
Out[10]:
{:type=>"pie", :name=>"Total consumption", :data=>[{:name=>"Jane", :y=>13, :color=>"red"}, {:name=>"John", :y=>23, :color=>"green"}, {:name=>"Joe", :y=>19, :color=>"blue"}], :center=>[100, 150], :size=>100, :showInLegend=>false}
In [11]:
# all te series options can be updated
# removing last pie chart, that was added
chart1.chart.series_data[2] = {}
Out[11]:
{}
In [13]:
chart1.show_in_iruby
Out[13]:
In [14]:
chart1.chart.options
Out[14]:
{:chart=>{:type=>"spline", :inverted=>true, :renderTo=>"xumfzkgscqj"}, :title=>{:text=>"Atmosphere Temperature by Altitude"}, :subtitle=>{:text=>"According to the Standard Atmosphere Model"}, :xAxis=>{:reversed=>false, :title=>{:enabled=>true, :text=>"Altitude"}, :labels=>{:formatter=>"function () {\n                  return this.value + 'km';\n              }"}, :maxPadding=>0.05, :showLastLabel=>true}, :yAxis=>{:title=>{:text=>"Temperature"}, :labels=>{:formatter=>"function () {\n                  return this.value + '°';\n              }"}, :lineWidth=>2}, :legend=>{:enabled=>false}, :tooltip=>{:headerFormat=>"<b>{series.name}</b><br/>", :pointFormat=>"{point.x} km: {point.y}°C"}, :plotOptions=>{:spline=>{:marker=>{:enable=>false}}}}
In [15]:
# all the `options` can be set or updated
chart1.chart.options[:chart][:inverted] = false
Out[15]:
false
In [16]:
chart1.div
Out[16]:
"                <script type=\"text/javascript\">\n        (function() {\n\n          var onload = window.onload;\n          window.onload = function(){\n            if (typeof onload == \"function\") onload();\n                    var options = { \"chart\": { \"type\": \"spline\",\"inverted\": false,\"renderTo\": \"probhlusncy\" },\"title\": { \"text\": \"Atmosphere Temperature by Altitude\" },\"subtitle\": { \"text\": \"According to the Standard Atmosphere Model\" },\"xAxis\": { \"reversed\": false,\"title\": { \"enabled\": true,\"text\": \"Altitude\" },\"labels\": { \"formatter\": function () {\n                  return this.value + 'km';\n              } },\"maxPadding\": 0.05,\"showLastLabel\": true },\"yAxis\": { \"title\": { \"text\": \"Temperature\" },\"labels\": { \"formatter\": function () {\n                  return this.value + '°';\n              } },\"lineWidth\": 2 },\"legend\": { \"enabled\": false },\"tooltip\": { \"headerFormat\": \"<b>{series.name}</b><br/>\",\"pointFormat\": \"{point.x} km: {point.y}°C\" },\"plotOptions\": { \"spline\": { \"marker\": { \"enable\": false } } },\"series\": [{ \"type\": null,\"name\": null,\"data\": [ [ 0,15 ],[ 10,-50 ],[ 20,-56.5 ],[ 30,-46.5 ],[ 40,-22.1 ],[ 50,-2.5 ],[ 60,-27.7 ],[ 70,-55.7 ],[ 80,-76.5 ] ] },{ \"data\": [ [ 10,15 ],[ 20,-50 ],[ 30,-56.5 ],[ 40,-46.5 ],[ 50,-22.1 ],[ 55,-2.5 ],[ 65,-27.7 ],[ 80,-55.7 ],[ 90,-76.5 ] ],\"name\": null },{  }] };\n        \n        window.chart_probhlusncy = new Highcharts.Chart(options);\n\n          };\n                })()\n        </script>\n\n<div id=\"probhlusncy\"></div>"
In [17]:
chart1.show_in_iruby # or do chart1.chart (but it will show chart when notebook is saved)
Out[17]:
In [18]:
# can be updated
chart1.chart.placeholder
Out[18]:
"ckapohlewum"
In [19]:
# can be updated
chart1.chart.html_options
Out[19]:
{:id=>"fxavwpmbjeg"}
In [20]:
chart1.chart.html_options[:style] = "opacity: 0.5; height: 720px; width: 1020px"
Out[20]:
"opacity: 0.5; height: 720px; width: 1020px"
In [21]:
chart1.show_in_iruby
Out[21]: